ホームページ作成講座

ホームページ作成講座 vol.04 …ボディ/テキスト/リンク/画像など


BODY要素
ブラウザに直接表示するところ。デザインするのはこの領域がメイン。
<body>〜</body>
非推奨だけど、スタイルシートで指定しない場合、bgcolor(背景色)、background(背景画像)、text(文字)、link(リンク)などは良く用いられている。
<body bgcolor="#FFFFFF">〜</body>
<body background="img/gif">〜</body>
<body text="#000000">〜</body>
など。

BR要素 終了タグなし
強制的に改行したい時に用いる。
文章<BR>文章

P要素 終了タグは省略可
段落を示す。BRを2つ重ねるのとは意味が異なる。また、spanで囲んでいる領域には使えない。
<P>段落

H1〜H6要素
見出し。H1が最上位、H6が最下位の見出しを示す。IEやNNでは『大きくて太い文字』で表示されるが、『見出し』の意味があるので見た目の整形に用いるべきではない。
<H1>見出し</H1>

B要素
文字を太くする。
<B>太字で表示したい文字</B>

STRONG要素
文字を強調する。IEやNNでの見た目はB要素に似ているが、単なる太字や斜体ではなく『強調する』意味のある文字に使うべき要素。
<STRONG>強調したい文字</STRONG>

HR要素 終了タグなし
水平線をひく。size(太さ)、width(長さ)、noshade(平面的にする)の指定が可能。

A要素
リンク先の情報等を含む要素。href、name、targetなどの属性を持つ。

属性:name … リンクの目的としての場所。ページ内で場所を指定するのに用いる。
<a name="link01" >〜</a>
↑ここに飛ばすためには<a href="#link01" >〜</a>と記述。

属性:href … リンク先を指定する。
属性:target … リンク先を開く場所(フレーム)を指定する。FRAMEやIFRAMEのname属性で決めてある場所か、または以下の動作をおこなう。
_blank=新規ウィンドウ/_parent=親フレーム/_top =フレーム消去+新規
<a href="url" target="_blank">〜</a>

IMG要素 終了タグなし。
画像を表示させる。
属性:src … 画像の所在を指定する。
属性:alt … 画像が表示出来ない時、代わりに表示する文字列。
属性:usemap … MAP要素のnameで指定したマップを読み込む。
属性:border … 画像の周囲の枠線の太さ(ピクセル)。非推奨。
属性:width/height … 幅と高さを指定。非推奨。
<img src="img/gif" alt="画像">

MAP要素
IMG要素などと一緒に用いる事でイメージマップを作る。
属性:name … イメージマップの名称。必須。

AREA要素 終了タグなし。
イメージマップに用いる要素。IMG要素、MAP要素と組み合わせて用いる。
属性:shape … イメージマップの有効範囲を指定する。
・属性値:rect … 長方形にマップの有効範囲を配置する。
・属性値:circle … 円形にマップの有効範囲を配置する。
<map name="map">
<area shape="rect" coords="0,0,100,100" href="url1">
<area shape="rect" coords="100,0,200,100" href="url2">
</map>
<img SRC="gif" BORDER=0 usemap="#map" height=100 width=200>


コメント
ソース中に、自分が更新する時などの目印にするコメントを挿入したい時は以下のように記入すればブラウザには表示されません。
<!-- この部分にコメントを記入 -->

Webデザイン制作
SEO:検索エンジン最適化
ホームページ作成講座
日刊運勢メールマガジン
Playstation2ゲーム攻略