html5 & css3メモ divタグに影をつけてみる
こないだのtableの角を丸める記事(記事はここ)に続いて、今度は影。
影もねぇ…画像でがんばってたもんだったなぁ…。
htmlページはこんな感じ。
<!doctype html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <style type="text/css"> div { background-color:white; box-shadow:3px 3px 3px 3px rgba(0,0,0,0.3); /* 影の大きさと色を設定する */ margin:10px; } </style> </head> <body> <div>box-shadow:3px 3px 3px 3px rgba(0,0,0,0.3)</div> </body> </html>
やるこた、こんだけ。
- cssで影をつけたいタグ、クラス、ID(今回は<div>タグ)のスタイルにbox-shadowのプロパティと値(影の大きさと色)を書く
で、Firefoxで確認してみたらこんな感じ。
ま、メモってことで。
ディスカッション
コメント一覧
まだ、コメントがありません