今のところちょくちょく見るプロパティをまとめた。
HTML5よりもブラウザごとの実装が状況がまちまちな気がしてる。
WebKitブラウザが独走してる感じ。
■フォントサイズを調整するプロパティ
iPhoneやiPod Touch などで画面の向きを変えたときに、
自動で文字サイズが変わるのを調整する。
-webkit-text-size-adjust: none;
値をnoneにすると自動調整をしないようにできる。
■テキストに影をつけるプロパティ
text-shadow: 0 1px 3px #000000;
順番に水平方法、垂直方向、ぼかし距離を指定。最後は影の色。
■ボックス要素に影をつけるプロパティ
-webkit-box-shadow: 0 1px 3px #000000; -moz-box-shadow: 0 1px 3px #000000;
順番に水平方法、垂直方向、ぼかし距離を指定。最後は影の色。
■グラデーションをつける
backgroundプロパティと組み合わせて使う。
background: -webkit-gradient( linear, left top, left bottom, from(#eeeeee), to(#ffffff) ); background: -moz-linear-gradient(top, #eeeeee, #ffffff);
webkitの場合は開始位置、終了位置、開始時の色、終了時の色。
mozillaの場合は
- top:上から下
- left:左から右
- left top:左上から右下
あとは開始時の色、終了時の色。
■背景画像のサイズ
背景に使う画像のサイズを指定する。
背景画像のみをサイズ調整できる。
background-size: 432px 192px;