[PR] 容量300MB、月額125円、高性能なサーバが日本最大級のバックボーンに直結。さくらのレンタルサーバ

スタイルシート・CSSを書いてみよう

枠線・ボーダーのバリエーション 一覧

 CSSのボーダーにはいつくかのバリエーションが存在します。実際のサイトでよく使われるスタイルは限られていますが、「こういう線も出せる」程度に把握しておくと良いでしょう。

ボーダーのサンプル 一覧

 dotted(点線)とdashed(破線)については、WINDOWS版IE4.0と5.0は対応していませんので注意が必要です。

solid(実線)
double(二重線)
dotted(点線)
dashed(破線)
groove(線の掘り下げ)
ridge(線の浮き出し)
inset(枠内の掘り下げ)
outset(枠内の浮き出し)

ボーダーのプロパティを設定するには?

 ボーダーのプロパティ設定方法はいくつかありますが、ここではプロパティの値をまとめて3つ設定する便利な方法をご紹介します。

 「枠線の幅」、「枠線の種類」、「枠線の色」のそれぞれの値は、半角スペースで区切ります。値の順番は入れ替えても構いません。

 なお、値を省略するとデフォルト(枠線なし)の設定が適用されてしまうので、設定漏れのないようにご注意ください。

サイトトップページへ戻る