リンク・画像タグ

リンクタグ
<A Href="URL"></A>
リンクを張る

<A Href="http://www.yahoo.co.jp/">Yahoo!JAPAN</A>

Yahoo!JAPAN

<A Href="URL" Title="説明文"></A>
オンマウスで説明文

<A Href="http://www.yahoo.co.jp/" Title="説明文">Yahoo!JAPAN</A>
Yahoo!JAPAN  ←マウスを乗せてみて下さい。

<A Href="URL" Target="_blank"></A>
リンクで別窓を開く

<A Href="http://www.yahoo.co.jp/" Target="_blank">
Yahoo!JAPAN</A>
Yahoo!JAPAN

ターゲットの種類
  • Target="_blank"・・・・別枠を開いたリンク
  • Target="_top"・・・・全てのフレームを取り払うリンク
  • Target="_self"・・・・同じ枠でリンク
  • Target="_parent"・・・・一番外のフレームは残す。
  • Target="フレーム名"・・・・フレームから別フレームへのリンク
<例>
<A Href="http://www.yahoo.co.jp/" Target="_blank">Yahoo!JAPAN</A>
Yahoo!JAPAN
リンクを装飾する
<Title>〜</Title>のすぐ下に挿入して下さい。
  • リンクの装飾を一括で指定。ポイント時だけ変化させる。
    <Style Type="text/css">
    <!--
    A{ text-decoration:none;}
    A:hover{ text-decoration:
    underline; color:#0000ff; }
    //-->
    </Style>

リンクの装飾をそれぞれで指定。

<Style Type="text/css">
<!--
A:link { text-decoration:
none; color:#000080; }
A:visited { text-decoration:
none; color:#000080; }
A:active { text-decoration:
underline; color:#000080; }
A:hover { text-decoration:
underline; color:#1e78ff; }
//-->
</Style>

解説
a:link … リンク前
a:visited … リンク後
a:active … 押した時
a:hover … ポイント時

装飾の種類とサンプル
none タグ辞書
underline タグ辞書
overline タグ辞書
line-through タグ辞書
例)a:hover { text-decoration: underline overline line-through ; }
タグ辞書
リンク下線を消す
a {text-decoration: none;}

a {text-decoration: none;}

使い方
これを<Title>〜</Title>のすぐ下へ入れましょう。


画像タグ
<Img Src="">
画像を貼る

<Img Src="sanrin.gif" Width="92" Height="63">

<A Href="URL"><Img Src=""></A>
画像でリンク

<A Href="URL/" Target="_blank">
<Img Src="sanrin.gif" Border="0" Width="92" Height="63">
</A>

大切なこと
Border="0"です。
これを記述しておかないと・・・
枠線がでてしまいます。

<Img Src="" Align="画像の位置">
画像に文字を回りこませる

<Img Src="sanrin.gif" Align="left">

Alignは、LeftCenterRightで指定できます。


<Img Src=""  Hspace="" Vspace="">
回りこみの間隔を指定する
 
<Img Src="画像URL" Align="画像の位置" Hspace="横間隔" Vspace="縦間隔">

<Img Src="sanrin.gif" Align="left" Hspace="40" Vspace="20">

<A Href="#***"></A>
同じページ内リンク

<A Name="アンカー名"></A>

をページ内の飛ばしたい場所へ埋め込み
<A Href="#アンカー名">〜</A>
がその場所へ飛ばす、リンクタグになります。
使い方サンプル
少し下にリンクしてます。
<A Href="#tag">少し下にリンクしてます。</A>








※この位置にアンカーを張ってます。
<A Name="tag">この位置にアンカーを張ってます</A>


<A Href="#***" Target="フレーム名"></A>
フレームでのアンカーリンク

右フレームの飛ばしたい位置に張るタグ

<A Href="#アンカー名">〜</A>
左フレームに張ったアンカーへ飛ぶリンクタグ
<A Href="アンカー名" Target="フレーム名"></A>

右のフレーム名が「migi」の場合、左から右へ普通にリンクすると
<A Href="URL#アンカー名" Target="migi"リンク</A>
と、書きます。

<A Href="mailto:メルアド"></A>
メールリンク

<A Href="mailto:メルアド">メール</A>

メール