∇ WEBプログラマー 便利帳 ≫ CSS
HTML CSS
*
▼スポンサー広告
次の広告へ
▼スポンサー広告
次の広告へ
▼スポンサー広告
次の広告へ
『 
CSSプロパティ(目的別)
 』
ボックスレイアウト
border ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
線の太さや色、角丸を指定する
border-bottom ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
下線の太さや色、角丸を指定する
box-shadow ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
影やぼかしを指定する
display ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
様々な並び方を指定する
float ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
左右回り込みを指定する
height ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
高さを指定する
margin ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
外の余白を指定する
position ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
浮遊配置方法を指定する
width ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
幅を指定する
background・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
様々な背景を指定する
テキストレイアウト
color ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
色を指定する
font ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
まとめて指定する
font-weight ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
太さを指定する
line-height ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
行の高さを指定する
overflow・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
はみ出た部分を指定する
text-align ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
左右の配置を指定する
text-shadow ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
影を指定する
text-decoration ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
線や点滅を指定する
vertical-align ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
上下の配置を指定する
white-space ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
スペースや改行の表示方法を指定する
box-shadow
影やぼかしを指定する(ボックス)
Internet Explorer9~
Firefox4~
Google Chrome2~
Opera1~
Safari4~
記入例
box-shadow :
数値1
数値2
数値3
数値4
;
+
属性プロパティ
水平影のオフセット距離、右方向は正の値、左方向は負の値を指定すると影が移動します。
垂直オフセット距離、下方向は正の値、上方向は負の値を指定すると影が移動します。
影のぼかし、値が大きいほど影の端のぼかしが強くなります。
線幅、全方向の拡大は正の値、全方向の縮小は負の値を指定します。
影色、カラーコードやカラーネームで記入します。
ボックスの外側の影から内側の影に変更されます。
【 box-shadow 属性 】
border-radius
[
ボックスの角丸を指定する
]
※複数の影を指定する場合は、カンマ( , )区切りで複数指定します。

HTMLサンプルコード
※上記プロパティ値や下記のタグをクリックして、下のフォーム内に反映させて使用します。
表示結果

▼スポンサー広告
次の広告へ
▼スポンサー広告
次の広告へ