ホームページ制作アトリエ

心えがおホームページ制作 atelier(アトリエ)は、ホームページ・動画制作、教育ICT・アプリ開発、名刺・ポスター・チラシの作成を行っております。

ベンダープレフィックス まとめ

カテゴリー:Summary
css3からベンダープレフィックスを付けなくてはいけない事が増えました。
毎回打つのが面倒なのでベンダープレフィックスを使うコードを、今更ながら自分用にまとめておくことにしました。

主要ブラウザのベンダープレフィックス

Firefox-moz-
Google Chrome、Safari-webkit-
Opera-o-
Internet Explorer-ms-

よく使うコードのひな形

画像ボーダー
角丸
一個ずつ角丸を指定した場合
box-shadow
影を定義する指定内容
1つめのパラメータ水平方向のオフセット距離(正の値→右、負の値→左)
2つめのパラメータ垂直方向のオフセット距離(正の値→下、負の値→上)
3つめのパラメータぼかしの距離。※負の値は不可
4つめのパラメータ広がりの距離。影の形状。(正の値→拡大、負の値→縮小)
5つめのパラメータ色の値
inset内側の影
box-shadowプロパティは、::first-letter擬似要素に適用されますが、::first-line擬似要素には適用されません。
また、border-collapse:collapse;が指定されたtable内要素には、外側の影はつきません。
transform