サイト作成に役立つHTMLタグ

HTMLタグとは、サイトを作成する際に使うタグです。

HTMLとは、Hyper Text Markup Language(ハイパーテキストマークアップランゲージ)の略で、タグと言う命令を記述することでWEBサイトを作ることができます。

よく使うHTMLタグ

リンクタグ

リンクを張るときに使うタグです。

同枠で開く場合
<a href=”リンク先URL”>テキストや画タグ</a>

外枠で開く場合
<a href=”" target=”_blank”>テキストや画像タグ</a>

画像挿入タグ

<img src=”画像URL” />
例)<img src=”http://m-affili.com/wp-content/uploads/2012/01/miyazaki160-4.jpg” />

<img src=”画像URL” alt=”キーワード等” />
例)<img src=”http://m-affili.com/wp-content/uploads/2012/01/miyazaki160-4.jpg” alt=”宮嵜誠プロフィール画像” />

<img src=”画像URL” alt=”キーワード等” title=”タイトル” />
例)<img src=”http://m-affili.com/wp-content/uploads/2012/01/miyazaki160-4.jpg” alt=”宮嵜誠プロフィール画像” title=”プロフィール” />

<img src=”画像URL” alt=”キーワード等” title=”タイトル” width=”幅(数字)” />
例)<img src=”http://m-affili.com/wp-content/uploads/2012/01/miyazaki160-4.jpg” alt=”宮嵜誠プロフィール画像” title=”プロフィール” width=”128″ />

<img src=”画像URL” alt=”キーワード等” title=”タイトル” width=”幅(数字)” height=”高さ(数字)” />
例)<img src=”http://m-affili.com/wp-content/uploads/2012/01/miyazaki160-4.jpg” alt=”宮嵜誠プロフィール画像” title=”プロフィール” width=”128″ height=”52″ />

<img src=”画像URL” alt=”キーワード等” title=”fuji-main.jpg” width=”300″ height=”52″ class=”その他の情報” />
例)<img src=”http://m-affili.com/wp-content/uploads/2012/01/miyazaki160-4.jpg” alt=”宮嵜誠プロフィール画像” title=”プロフィール” width=”128″ height=”52″ />

画像をリンクにする場合は、
<a href=”リンク先URL”>こちら</a>
に上記のような画像タグを入れます。

 

アフィリエイトサイトを作る際に役立つHTMLタグ

色を変えるタグ

赤の場合、こちらを挿入すると
<font color=”red”>テキスト</font>

以下のように赤いテキストになります。
テキスト

緑の場合
<font color=”green”>テキスト</font>

テキスト

ポインタを乗せた時に動くようにするタグ

まず以下の文字列をスタイルシートの最後に追加します。
div.img-move a:hover {
position: relative;
top: 5px;
left: 5px;
}

その後、以下のタグを使ってテキストリンクや画像を挟むことで上下するようになります。

<div class=”img-move”>
テキストリンクか画像リンク
</div>

タグ


このページの先頭へ