HPB18 | HPB19 コンテンツ一覧
ホーム > HPB19 > HTML タグ辞典 > border
目次 | 元のページ 前のページ | 次のページ サイトマップ | ページEND

HTML タグ辞典 border


border リファレンス



border 説明



border プロパティは、境界線(ボーダー)のスタイル、太さ、色をまとめて指定する際に使用するプロパティで、スタイル、太さ、色のうち、指定する値を任意の順序でスペースで区切って記述します

border プロパティは、境界線(ボーダー)のスタイル、太さ、色について、上下左右一括で同じ値を指定する為のプロパティです

上下左右の境界線(ボーダー)を異なった様式にする場合は、 border-top、 border-bottom、 border-left、 border-right、 または、 border-style、 border-width、 border-color、 を使用します



border プロパティ 指定例



指定 説明 記述例
border 設定値 上下左右の境界線を一括で指定
div.example1 {
border: thick #ff0000 solid;
}
border-指定値 設定値 上下左右の境界線を個別に指定
(指定値 の部分には、top、right、bottom、left が入ります)
div.example2 {
border-top: 2px #85b9e9 solid;
border-right: 4px #bde9ba double;
border-bottom: 6px #ffd37d dotted;
border-left: 8px #d1d1d1 dashed;
}



border 書式



<table border="0" width="740">



ボーダースタイルの値



設定値 内容
none
(初期値)
ボーダーは表示されず、太さも 0 になります
表のセルなどのボーダーが重なり合う場合は他の値が優先されます
hidden ボーダーは表示されず、太さも 0 になります
表のセルなどのボーダーが重なり合う場合はこの値が優先されます
solid 1本線で表示されます
double 2本線で表示されます
dashed 破線で表示されます
dotted 点線で表示されます
groove 立体的に窪んだ線で表示されます
ridge 立体的に隆起した線で表示されます
inset 上と左のボーダーが暗く、下と右のボーダーが明るく表示され、ボーダーで囲まれた領域全体が立体的に窪んだように表示されます
上下左右の一部だけに指定しても立体感は出ません
outset 上と左のボーダーが明るく、下と右のボーダーが暗く表示され、ボーダーで囲まれた領域全体が立体的に隆起したように表示されます
上下左右の一部だけに指定しても立体感は出ません



ボーダー太さの値



設定値 内容
数値で指定 数値に px、em、ex などの単位をつけて指定します
px とは 1ピクセルを 1とする単位で、実際に表示されるサイズは 72dpi や 96dpi といったモニタの解像度により変化します
また、em とはフォントの高さを 1とする単位で、ex とは小文字の 「x」 の高さを 1とする単位です
キーワードで指定 thin(細い)、medium(普通)、thick(太い)のうち、いずれかを指定します
キーワードで指定する場合、実際に表示される太さはブラウザにより異なります



ボーダー色の値



設定値 内容
#000000などの記述やカラーネームで色指定をします
transparent ボーダーの色を透明にします





border SEOへの影響


特に影響はありません

<補足>
SEO ( Search Engine Optimization : 検索エンジン最適化 ) とは、Google、Yahoo!、Goo 等の検索サイトで検索された際に、検索結果表示ページ(SERP : サープ : Search Engine Result Page )の前の方(上位)に表示されるように工夫して、ホームページ、ブログをつくることです
そのために用いる方法をSEO対策と言い、適切に使うことによりSEOに効果のあるタグがあります
SEO対策について、詳しくお知りになりたい場合、詳細は、「 SEO対策 SEOとは 」をご参照下さい

目次 | 元のページ 前のページ | 次のページ サイトマップ | ページTOP
ホーム > HPB19 > HTML タグ辞典 > border
HPB18 | HPB19 コンテンツ一覧
   

© 2014 abhp.net All Rights Reserved.

参考情報


border-スタイルシートリファレンス
スタイルシート[CSS]-ボックス-境界線の設定をひとまとめに行う - TAG index Webサイト

HTML タグ辞典

ページTOP
ページTOP
ページTOP
ページTOP
ページTOP
ページTOP