【CSS3】CSSのtransformの値を４つ紹介【scale、translate、rotate、skew】
【CSS3】CSSのtransformの値を４つ紹介【scale、translate、rotate、skew】 こんにちは、WEBマーケティング部の杉尾です。 今回は要素を変形させるCSS3のプロパティ、transformの概要です。 transformは、２Ｄ（平面）と３Ｄ（立体）の指定ができるのですが、今回はまず２Ｄを紹介します。 CSS3のtransformプロパティとは？ transformとは読んで字のごとく、『変形』に関するプロパティです。 要素を「移動・拡大・回転・傾斜・遠近」させることができます。 animationプロパティや@keyframesと組み合わせることで、複雑な動きをさせることが可能になります。 transformの対応ブラウザ 便利な『transform』プロパティですが、各主要ブラウザの対応状況はどうでしょうか？ いつものように、Caniuse.comへ行
【CSS3】 ベンダープレフィックスとは？ （プロパティによっては不要）
ベンダープレフィックス（接頭辞）とは、ブラウザベンダーが独自の拡張機能を実装するとき、または草案段階の仕様を先行実装する場合に付ける識別子のことです。 プロパティにつけてそれが拡張機能であることを示します。 左がベンダープレフィックス、右に書いたものが各ブラウザ名です。 ベンダープレフィックスの書き方 【参考ソース】 .foo { -o-border-radius: 8px; -ms-border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; } border-radius（角丸指定）というプロパティの前に、先ほど紹介した『-ms-』とか『-o-』などがついていますね。 別の指定する場合も、同じくプロパティの前にこれらをつけます。 書き方の順番ですが、上記の例ではベ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
★【CSS】スマホ、タブレットの横幅(端末解像度と実質解像度)