*

よく使いそうなCSS3のlinear-gradientの指定を整理してみた(2015年3月)

   

mac
CSS3のグラデーションについて、結局どこまで指定したらいいのかわからなくなるので一旦自分用に整理しておきます。

スポンサードリンク

先に参考にさせてもらったサイト
» [CSS3]面倒なCSS3、linear-gradientを使いやすくまとめてみた
» HTML5:そろそろスッキリさせたい!CSS3 linear-gradient のベンダープレフィックス

上記のサイトでは「-moz-linear-gradient」と「filter」を省いてあったりもされてますが、Mozilla系もIEのレガシーブラウザもまだ捨てきれず(-_-;)
ただOperaはもういっかなーということで下記のようになりました。

上記のサイトを参考にさせてもらいつつ自分用

//CSS
#gradientBox {
	background: -moz-linear-gradient(top, #FFFFFF, #F1F1F1); /* for Mozilla */
	background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#F1F1F1)); /* for Webkit */
	background: linear-gradient(to bottom, #FFFFFF 0%, #F1F1F1 100%); /* for ie10+ */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#F1F1F1', GradientType=0); /* for ie7,8,9 */
}

でもやっぱまだ多いですねー。。
どこまで対応するかなんでしょうが。
ieのレガシーを無視してよくなったら、また整理しようかと思います。

 -Web

Sponsored link

Sponsored link

  関連記事

no image

Macbook Pro の初期化の方法

初期化ってなかなかやらないから忘れちゃいますよね。 自分用メモ。 Macbook Pro OSX 10.5.8の場合 ■

iOS8で閲覧すると、aタグがついてる画像にzoomプロパティが効いてない

しばらくOSのアップデートは様子見しておこうかと思ってたのですが、色々面倒になったのでアップデートしました。 ぼちぼち巷

no image

結局Refills買ってみた

今主婦中にもかかわらず、とうとうRefills買ってみた。 Refills for iPhone そのうち仕事でも使うで

4.0にアップデート

iPhone4は買ってないけど、4.0にアップデート。 新機能は全然使い倒してないけど、フォルダ分けできるのは便利ですね

no image

モバイルの初期入力モードの設定

今更なんですけど、書いてないと混乱するのでメモ。 htmlでは、「istyle(docomo)」「format(au)」

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*

共働きの30代女性。
福岡でWebに携わってます。
主に自分用の細かいメモを書いてます。
細かい内容が多いですが、他の方にも役立つなら幸いです。

確定拠出年金、退職したときに行う手続き(継続するor掛金停止する)

私、昨年から確定拠出年金をしております。 会社には確定拠出年金の制度がなかったので、「個人型年金」の加入者として掛金の拠

実は先月で退職しました

だいぶブログさぼっておりましたが、実は先月末で会社を退職しました。 別にこの歳になって、自主退職したわけじゃないのです。

Thunderbirdのアドオン「QuickText」のテンプレが消えた?時の対処法

後で調べたら、QuickTextで割とよく見られる問題?のようですが、私は今回初めての体験だったので焦りました。 私の場

  • ブログランキング・にほんブログ村へ