CSS(Cascading Style Sheets)
目 次
Links †
CSSとは †
CSS(Cascading Style Sheets:カスケーディング・スタイル・シート)は、HTMLで記述されたWebページのスタイルを効率的に定義するための技術。HTMLで内容を定義し、CSSでスタイルを定義することにより、内容とスタイルを分離することが可能となる。
ボックスモデルの構造 †
マージンと余白 †
マージン(margin)の指定 †
- margin-top(値):上マージンを指定
- margin-bottom(値):下マージンを指定
- margin-left(値):左マージンを指定
- margin-right(値):右マージンを指定
余白(padding)の指定 †
- padding-top(値):上の余白を指定
- padding-bottom(値):下の余白を指定
- padding-left(値):左の余白を指定
- padding-right(値):右の余白を指定
枠線(border)の指定 †
線の太さ †
- border-top-width(値):上枠線の太さを指定
- border-bottom-width(値):下枠線の太さを指定
- border-left-width(値):左枠線の太さを指定
- border-right-width(値):右枠線の太さを指定
線のスタイル †
- border-style (スタイル)
上下左右4辺の枠線に共通のスタイルを指定
- none : 枠線なし
- solid : 実線
- double : 二重線
- dotted : 点線
- border-style (上) (右) (下) (左)
上下左右の4辺それぞれにスタイルを指定
- border-top-style(スタイル):上枠線にスタイルを指定
- border-bottom-style(スタイル):下枠線にスタイルを指定
- border-left-style(スタイル):左枠線にスタイルを指定
- border-right-style(スタイル):右枠線にスタイルを指定
線の色 †
- border-color (色)
上下左右4辺の枠線に同一の色を指定
- border-color (上) (右) (下) (左)
上下左右の4辺それぞれに色を指定
- border-top-color(色):上枠線に色を指定
- border-bottom-color(色):下枠線に色を指定
- border-left-color(色):左枠線に色を指定
- border-right-color(色):右枠線に色を指定
サンプル †