W3Cで「モジュール背景とボーダー」について2011年2月15日付けで更新されてますね。 CSS3では、背景画像の幅・高さを拡大・縮小するプロパティが追加されていますので、あらためてまとめてみます。 拡大・縮小による画像劣化が気になるところですが、許容できるかどうかの判断は個人差があると思います。近頃のブラウザは優秀で、いい感じでスムージングされるので「OK！」とぼくは判断しました。 さすがにIE6の拡大・縮小したときのジャキジャキ感は堪えられませんが、そもそも「background-size」は適用されず無視されるので、IE6では背景画像は拡大・縮小されません。 Safari、Google Chrome、Operaですでに実装されています。 Firefoxもプリフィックス「-moz-」で適用されます。 IE8では残念ながら未実装でした。。。この辺はプログレッシブエンハンスメントで乗り切り
background-size－CSS3リファレンス
background-sizeプロパティは、背景画像のサイズを指定する際に使用します。 長さやパーセンテージで指定する場合、値を２つ記述すると、それぞれ記述した順に幅と高さを表します。 １つだけ指定した場合には、もう１つはautoと解釈されます。負の値を指定することはできません。 ■値 auto 自動的に算出される（初期値） contain 縦横比は保持して、背景領域に収まる最大サイズになるように背景画像を拡大縮小する cover 縦横比は保持して、背景領域を完全に覆う最小サイズになるように背景画像を拡大縮小する 長さ 背景画像の幅・高さを指定する パーセンテージ 背景領域に対する背景画像の幅・高さのパーセンテージを指定する CSSソースは外部ファイル（sample.css）に記述 p.sample1 { width:300px; height:80px; padding:15px; bo
TOPCSS 【CSS】background-sizeで背景画像をレスポンシブに設定する方法 【CSS】background-sizeで背景画像をレスポンシブに設定する方法 公開日：2016.11.28 更新日：2023.03.19 CSS CSSの background-size プロパティは、背景画像のサイズを指定できます。 表示領域のサイズに合わせて背景画像が拡大、縮小されるので、レスポンシブサイトの制作に役立ちます。 同じ画像をそれぞれの値で表示したサンプルを作成したので、以下をご覧ください。 サンプルページ
CSS 3のbackground-sizeとbackground-break：FirefoxとSafariのCSS対応 - builder by ZDNet Japan
前回に続いて、CSS 3で追加された背景に関するプロパティを確認していきたい。 今回は、背景画像の大きさを指定するbackground-sizeと、インライン要素の背景画像の繰り返し方法を指定するbackground-breakを取り上げる。background-sizeにはSafari 3とOpera 9.5が、background-breakにはFirefoxが対応している。 なお、背景に関する規格については、CSS 3の草案CSS3 Backgrounds and Borders Moduleを参考にする。 背景画像の大きさを指定するbackground-size background-sizeは、背景画像の大きさを指定するプロパティだ。現在、Safari 3が対応しており、-webkit-background-sizeというプロパティ名で利用することができる。また、Opera 9.
[jQuery]IE7、8でもbackground-size:containが利用できるプラグインjquery.backgroundSize
IE7、IE8のブラウザでもCSS3のbackground-size:containとbackground-size:coverを使用するためのjQuery プラグインがjquery.backgroundSizeです。 そこまでしてIE対応が必要か…の話は置いておいて、今回はjquery.backgroundSizeの基本的な使い方をサンプルに加えて、プラグイン使用に関する注意点も合わせてご紹介します。
![[jQuery]IE7、8でもbackground-size:containが利用できるプラグインjquery.backgroundSize](https://cdn-ak-scissors.b.st-hatena.com/image/square/d089498f59e4d4cfc4632107b84c028c9475302b/height=288;version=1;width=512/https%3A%2F%2Fwebantena.net%2Fwp-content%2Fuploads%2F2013%2F06%2F7567749.jpg)
【jQuery】IE8以下でもCSS3のbackground-sizeプロパティが使えるようになるプラグインjquery.backgroundSize.js | Rapid Progress
IE8以下でもCSS3のbackground-sizeプロパティが使えるようになるプラグイン「jquery.backgroundSize.js」についてです。最近縦長＋背景画像が横幅100%になるページを作る機会が増えました。 そんな時便利なのがCSS3から登場した「background-size」というプロパティですが、IE8以下は当然（？）対応していません。 が、非常に有難いことに、「jquery.backgroundSize.js」というプラグインを用いることでIE8以下でもbackground-sizeプロパティが使えるようになります。 1.background-sizeプロパティについてちょっとだけ CSS3から背景画像の幅と高さを拡大・縮小するプロパティが追加されました。それがbackground-sizeプロパティです。なんか文章で説明しても伝わりにくいと思うのですが、とに
IE8 IE7 IE6 でCSS3の background-size: contain; を使用できるようにするjQueryプラグイン｜プログラムメモ
とこれが Windows IE8 7 6 ではこのプロパティは認識されません。 そこで以下のjQueryプラグイン ■ jquery.backgroundSize.js （要 jQuery バージョン1.7.0以降 ） http://louisremi.github.com/jquery.backgroundSize.js/demo/ ■ 使い方（＜div class="hoge"＞に { background-size : cover; } を適用する。） <script type="text/javascript" src="jquery.js"></script> <!--[if lte IE 8]> <script type="text/javascript" src="jquery.backgroundSize.js"></script> <script> jQuery(docu
[18-5] 水玉、ボーダー、チェック柄を作ろう（background-size） 最終更新日：2017年11月01日 （初回投稿日：2011年08月15日） 今回は、グラデーションの応用編です。 CSSのグラデーションで「水玉」や「ボーダー柄」を作り、それをCSSの新プロパティ background-size でタイリングさせます。 使用する CSSプロパティ こんなものを作ります↓ 本日のINDEX 水玉模様の背景を作ろう 円形グラデーションの応用で「正円」を描く 「正円」をリピートして水玉模様にしよう 「background-size」について 縦、横、斜めの縞模様の背景を作ろう 縞模様を組み合わせてタータンチェック柄を作ろう 応用でボタンとか作ってみた ● 2017年10月：この記事には ベンダープレフィックス（-webkit- などの接頭辞）を使っていましたが、不要と判断し削除し
![[18-5] 水玉、ボーダー、チェック柄を作ろう（background-size）](https://cdn-ak-scissors.b.st-hatena.com/image/square/0369ecd9c29f6086e78d26a2468f5f731f42a00a/height=288;version=1;width=512/https%3A%2F%2Fblog-imgs-110-origin.fc2.com%2Fh%2Fo%2Fn%2Fhonttoni%2Fogp_image.jpg)
背景画像のサイズは複数の要素で共通なのでまとめて指定し、その後に個別の要素に背景画像を指定するという場合があります。 例えば以下のような見た目を作りたい場合なんかがそうでしょう。 HTMLはインスペクターか何かで見ていただくとして、関係あるCSSは以下のようになっています。 .test li { background-position: center top; background-repeat: no-repeat; -webkit-background-size: 50px 50px; background-size: 50px 50px; } .test .red { background-image: url(http://maboroshi.biz/clearskysource/wp-content/uploads/2012/09/nya01.png); } .test .blu
CSS チュートリアル CSS の基本 CSS の第一歩 CSS の第一歩の概要 CSS とは何か CSS 入門 CSS の全体像 CSS の働き 評価課題: 経歴ページのスタイル設定 CSS の構成要素 CSS の構成要素の概要 CSS セレクター Type, class, and ID selectors Attribute selectors Pseudo-classes and pseudo-elements Combinators カスケードと継承 Cascade layers ボックスモデル 背景と境界 書字方向の操作 内容のはみ出し CSS の値と単位 CSS における大きさの指定 画像、メディア、フォームの要素 表のスタイル付け CSS のデバッグ CSS の整理 評価課題: CSS の基本的な理解度 評価課題: 素敵なレターヘッドの便箋の作成 評価課題: かっこいいボック
公開日2015-03-26タグCSS親要素に対して子要素を上下左右に中央配置する TRBL メソッドというものがある。 .wrap { position: relative; width: 300px; height: 300px; border: 1px solid magenta; resize: both; overflow: hidden; } .inner { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 176px; height: 244px; background-color: grey; } .inner を img 要素にして、画像の大きさが不定の時でも頑張る方法は以前記事にしているので参考までに。 この TRBL メソッドでさらに頑張ると、背景指定ではなく
Updated 2013.09.20 / Published 2013.09.20 iOS7のレンダリングエンジンからは、backgroundのショートハンドがCSS3仕様対応になりました。CSS3仕様のBackgrounds Shorthandを確認すると、backgorund-sizeも同時に含められるようになっています。ショートハンドでは、値を省略した場合に省略した部分は初期値が適用されることになります。これにより次の場合に問題が発生します。 background-sizeプロパティを先に書いて、backgroudプロパティを後に書いている background-size:320px auto; background:#fff url(xx.png) 0 0 no-repeat; この場合、background-sizeプロパティの指定があとのbackgroudショートハンドのbac
jQueryでIE8でCSSの「background-size:cover」プロパティを擬似的に再現する実験｜BLACKFLAG
CSSでエリアの幅や高さに合わせて背景画像をフィットさせることができる「background-size:cover」。 とても便利なプロパティなのですがIE8以下のIEブラウザには対応していません。 IE8以下で「background-size:cover」を実装させるjQueryプラグインもいくつかありますが 実際に使ってみた際に理想通りに動作しないこともあったので jQueryを使ってIE8以下で「background-size:cover」を実現させる方法を 実験的に試してみたサンプルをご紹介してみます。 まずは動作サンプルから。 ※IE8以下のブラウザと見比べてご確認ください。 「jQueryでIE8でCSSの「background-size:cover」を擬似的に再現する方法」サンプルを別枠で表示 サンプル画面内に設置した画像表示エリアには背景画像を敷き、 「background
background-sizeで1ピクセルにした時の各ブラウザの挙動の違い - 聴く耳を持たない(片方しか)
昨日の日記 で書いた通り、こうしたtumblrを始めてみました。 http://96x96.net/ 仕組みとしては、一つの投稿ごとそれぞれ CSS で border-image と 背景画像を指定して実現しています。マウスオーバーで動くのは単純な Transitions ですし、基本的にはそんなに難しいことはやってないですね。対応しているブラウザは新しいものに限られてしまうものの、主要なモダンブラウザなら大抵表示されると思います。 で、問題は背景画像の設定について。 よくある背景画像の指定というと div{ background-color: #FFFFFF; background-image: url(image.jpg); background-repeat: no-repeat; background-attachment: fixed; background-position:
background-sizeとグラデーション WebKitでbackground-sizeとグラデーションを合わせて利用しようとした所、どうも思い通りにいきませんでした。 まずはちゃんと表示できるパターン。 body{ background-image : -webkit-gradient(linear, left top, right top , from(rgba(255,255,255,0)), color-stop(90%,rgba(255,255,255,0)), color-stop(91%,#c7daf2), to(#c7daf2)); -webkit-background-size:11px; background-size:11px; background-repeat:repeat } こう行った感じで背景にストライプを描画しようとしています。 サンプル これは「le
テッテッテッテ♪ テッテッテッテ♪ テッテッテッテ♪ テッテッテッテ♪ テレレ～♪ テレレ～♪ テレレ～♪ あ、これはミッションインポッシブルのあの曲です。脳内再生で夜露死苦。 さてさて。 最近のCSSにはbackground-sizeっていうのがあって、背景の画像サイズを調整できるようになっているんですね。これのおかげで、ある程度大きな背景画像でも望む大きさで表示させることができるので、なかなか便利なやつだと思います。 でもこのbackground-size、ChromeとかSafariなんかでは問題なく使えるんですが、IEの場合はバージョンが9以上じゃないと使えないみたいなんですね。なのでうっかりIE8なんかでサイトを見ると、背景画像がでっかいまま表示されてしまっている。 「これ見てくれよジョニー。IE8じゃこのでかいフランクフルトの背景画像が指定サイズに収まらないぜ。まるでパンツに収
【CSS】background-sizeとbackground-positionを使うとドット絵が描けちゃいます！【極端な例】 - Little Strange Software
どうも！LSSです！！ だいぶ前の記事ですが、 で使用した、background-sizeとbackground-positionというプロパティの自由度の高さを確認してみます！ CSSでドット絵が描けます！ まず枠を作ります ドットをひとつ置いてみます 小さすぎて分かりにくいので、大きくしてみます ここで ちょっと解説 その１ background-image: linear-gradient(red,red); background-size: 5px 5px; background-position: 25px 25px; background-repeat: no-repeat; ２つめのドットを置いてみます ここで ちょっと解説 その２ ２つめのドットを横長にしてみます どんどん増やせます！ かなり極端な例でした^^; CSSでドット絵が描けます！ まず枠を作ります コード <d
昨今の PC、スマートフォン、タブレット等デバイスのマルチスクリーン対応 (いわゆるレスポンシブウェブデザイン) は、 CSS について色々としらないと大変です。 知っていればできる、知らないと出来ない (もしくは手間がかかる)、ということが多いです。 ここでは CSS3 における背景 (background) の設定で、特に background-size 属性について少し詳しくみていきましょう。 background-size 属性による違い CSS3 では背景 (background) の設定はいろいろな要素ができます。詳しくは W3C の background の説明ページを見ていただくことにして、 ここでは background-size について動作をみてみましょう。 尚、ここで使用する背景画像は次の画像です。端がわかるように黒い正方形を書いています。 background-s
夏の暑さに負けてポケモンGOが滞っているyanagimachiです。 運動不足なので、毎日1匹孵化させるのを目標にがんばって歩こうと思います。 さてさて、正規表現といえばバックエンドの人たちがバリバリフォームとかで使っているイメージだと思います。 私も普段はバックエンドのfujiharaさんに書いてもらえばいいや・・・と思っています。 でもたまーに大量修正するの大変だからフロントエンドでも使いたいなという場面があると思います。 初回はbackground-size編です！ ショートハンドでbackground-sizeを書いちゃった でも、対象ブラウザにAndroid4系デフォルトブラウザが入っていたなんてときは、別々に記述する必要がありますよね。 正規表現で書き換えちゃいましょう！ 置換したいCSS background: url(/img/bg.png) 50% top /100px
background-attachment:fixed;とbackground-size:cover;はモバイル時に衝突する。 - Phiyard Blog
2015-01-13 background-attachment:fixed;とbackground-size:cover;はモバイル時に衝突する。 HTML&CSS WebDev RWD 画像を大きく見せるデザインで、あるdiv領域にbackground-imageを適用するということはよくある。その際、CSSは次のようになる。これは、imageを固定させて、パララックスのように見せかける、「擬似パララックス」とでも呼ばれうるスタイルだ。昨日の記事を書いている時に見つけたサイトでも使われている(Frog - バンクーバーを拠点とするクリエイター留学サポート企業)。 .header-image-area { background-image: url("../img/example.jpg"); background-color: #0f0f0f; background-position:
GitHub - louisremi/jquery.backgroundSize.js: DEPRECATED, please use its successor: background-size polyfill
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
background-sizeの４つの指定の違いと背景画像のCSSでよく使われがちなパターン３つ | HPcode（えいちぴーこーど）
コーディング時に意外と使われがちな背景画像のCSSについて紹介です。 背景で最も覚えておくべきは「background-size」だと思います。この指定の違いによって表示がどのように変わってくるのか、マウスでドラッグしながら直感的に理解していこうという目的で作成しました。 また、ヒーローイメージや背景固定など、よく使わがちな背景の指定方法についても少しだけまとめました。 わたしがコーダーとして仕事するようになって、たぶん一番くらいの衝撃が「こんなにも背景使うの？」でした笑 コーディングを仕事にしている方は、ここに書かれていることは当たり前に理解しておくといいかもしれません！
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
While designing a mobile site recently, I discovered that the `background-size` CSS property is very buggy on iOS devices. What exactly happens is hard to say, but when the aspect ratio of your background-image is different from the target ratio, images get squashed. The curious thing is that there are several factors that can trigger this bug: - It only happens with JPGs. Images in GIF or PNG for
Help us understand the problem. What is going on with this article?
2007年のiPhone発売以来、スマートフォンにおける画像の表示サイズは、 最大幅320pxとされてきましたが、 2010年に発売されたiPhone4のRetinaディスプレイ対応によって、 それまで320pxの画像を実寸で表示していたものから 「640pxの画像を320px幅で表示する」という方法が主流になり、 さらにその後のAndroidのディスプレイの高精細化によって、 「ディスプレイのサイズに合わせて画像を幅100％でFixさせる」 と、変遷してきました。 それに伴い、背景画像も「ディスプレイのサイズに合わせて幅100％でFixさせる」 という表示方法が多く使われるようになり、 background-sizeプロパティをよく使うようになったので、覚書としてまとめました。 サンプルでは、300px×200pxの表示領域に、100px×100pxの画像を背景として表示しています。 ■
GitHub - louisremi/background-size-polyfill: Adds support for background-size "cover" and "contain" to IE8
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
こんにちは、WEBマーケティング部の杉尾です。 今回はCSS3のbackgroud-sizeで画像を背景全面に表示させる方法を紹介します。 最近、背景が全面画像になっているページがよく見られます。 以前は読み込みに時間がかかるのが難点でしたが、今は処理速度も回線速度も上がっていますので、問題なくデザインできるようになっています。 スマホサイト作成のときによく使われますので、是非覚えて使ってみてください。 主要ブラウザ対応状況 まず、いつものようにCaniuse.comを見に行き、各主要ブラウザのbackground-size対応状況を確かめます。 モダンブラウザではほぼ全てが対応済みです。（OperaMiniはブラウザシェアが低いので無視） 気になるのはIE8とAndroidブラウザの古いバージョンくらいですね。 その二つにも対応できるコードを紹介します。 対応ブラウザごとのソースコード紹
背景画像のサイズを縮小したり、拡大したり、サイズを変更したい時ってありますよね。 そういう時は、cssのbackground-sizeプロパティを使うと簡単にできます。 background-sizeを使うと画面いっぱいに背景画像を表示したりすることもできちゃいます。 そんな便利なbackground-sizeの使い方やテクニックを詳しく紹介していきますねー(^^)/ ※このページは「【css】背景（backgroundプロパティ）の使い方まとめ」の続きです。backgroundプロパティ全般について詳しくはそちらをご覧下さい。 目次 background-sizeプロパティの使い方 背景画像のサイズを単位付きの値で指定 背景画像のサイズをキーワードで指定 cover contain background-sizeを古いブラウザに対応させるには background-sizeプロパティの使
Android2.3.4で起きた。 たぶんどのAndroidでも起きる。 何が起きたかhttp://jsrun.it/GeckoTang/wbTo/ Androidで見てみてください。 background-imageで画像を１つしか指定してないのに background-sizeで複数指定するとその画像が複数背景指定される。 重なり順も指定した順でないからバグっぽい。 解決策background-image:url(“http://jsrun.it/assets/3/I/f/8/3If8f.png”), url(“”), url(“”), url(“”), url(“”), url(“”), url(“”), url(“”), url(“”); とかやっときゃいけるけどキモいしなんの解決にもなってない。 なぜ起きたかSassを使っていて、 @include background-size
Ask questions, find answers and collaborate at work with Stack Overflow for Teams. Explore Teams Collectives™ on Stack Overflow Find centralized, trusted content and collaborate around the technologies you use most. Learn more about Collectives
好きなCSSプロパティは background-sizeのcoverとcontain - ksk1015のブログ
CSS Property Advent Calendar 2013 の16日目の記事です。 好きなCSSプロパティというか値ですが、background-sizeのcoverとcontainです。 coverを指定すると、背景画像が縦横比を保ちながら要素を覆うようにぴったりとリサイズされ、containを指定すると、同じく縦横比を保ちながら要素内に収まるようにぴったりとリサイズされます。 対応してないブラウザもIE8以下くらいです。 嬉しい！ 下記のデモで background-sizeのcoverとcontain を体験できます。 明日は xl1 さんです。
Background-size - CSS3 . Info
Another new property introduced by the CSS3 Backgrounds and Borders module is background-size. The property adds new functionality to CSS allowing designers to specify the size of background images using either lengths, percentages, or by using one of two keywords; contain or cover. Browser support has grown of late, with the current versions of most popular browsers now supporting background-size
スマホでbackground-size:coverとbackground-attachment:fixedが効かない時【パララックス】 | Tarokenlog
スマホでbackground-size:coverとbackground-attachment:fixedが効かない時【パララックス】 スマホでは何故かbackground:coverとbackground-attachment:fixedが効かなくなり背景の画像が拡大されてパララックスが実現されなくなります。 そこで、このハゲーーーー！！ってなって色々解決策を考えたり調べたりしてとりあえず対処法を見つけましたww 短い備忘録です。 以下のCSSでなんとか解決 以下のコードでパララックスのようなことができます。 .main { background: none; } .main::before { content: ""; display: block; position: fixed; top: 0; left: 0; -webkit-transform: translate3d(0,
WEBアプリのトップ画面では、coverを使って画面幅最大で画像を表示しているケースが多いです。それぞれどのような動きになるのか確認しながら使ってみるのがおすすめです。 とはいえ、言葉だけでは少しわかりにくため、中でもよく使われることが多い「contain」「cover」について、詳しく解説します！ background-sizeプロパティを使ったサンプルコード 次に、background-sizeプロパティを使ったサンプルコードをもとに、具体的な使い方を解説します。 画面の一部を背景画像に設定するサンプル まず、表示領域に縦横比を維持したまま背景画像を表示するに設定する「background-size:contain」を指定したサンプルについて解説します。 サンプルコード – HTML： <!DOCTYPE HTML> <HTML lang="ja"> <head> <meta char
Updated 2013.09.20 / Published 2013.09.20 iOS7のレンダリングエンジンからは、backgroundのショートハンドがCSS3仕様対応になりました。CSS3仕様のBackgrounds Shorthandを確認すると、backgorund-sizeも同時に含められるようになっています。ショートハンドでは、値を省略した場合に省略した部分は初期値が適用されることになります。これにより次の場合に問題が発生します。 background-sizeプロパティを先に書いて、backgroudプロパティを後に書いている background-size:320px auto; background:#fff url(xx.png) 0 0 no-repeat; この場合、background-sizeプロパティの指定があとのbackgroudショートハンドのbac
CSS3から導入されたbackground-size非常に便利なプロパティです。 これさえあればbackground-imageに設定した画像のサイズを変更し放題、しかしIE8では効きません。 なんとかがんばる filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='背景画像のパス',sizingMethod='scale'); と指定すると、background-size: 100% 100% に近い動きを実現できます。 jQueryのプラグインをつかう jquery.backgroundSize.js をつかうとJSの力で解決できます。 jquery.backgroundSize.js
retina対応するとき縦横それぞれ2倍でつくってbackground-sizeで縮めるとかやるんだけど、Android2.1とかできかなくてどうしようかと思ってたらベンダプレフィックスついてないだけだった。 -webkit-background-size: 100px 50px; background-size: 100px 50px; iPhoneとかAndroid2.3だとプレフィックスいらないので注意。
「background-size:cover」をjQueryで実現する方法 | それからデザイン スタッフブログ
cssのbackgroundプロパティで使用できる「cover」という値は、画像の縦横比を保ったまま背景領域を全て覆うように自動で拡大縮小する便利なプロパティです。 ただ、この値を使うには画像を背景に指定する必要があり、imgタグで画像を配置したい場合は使用できません。そこで今回は、imgタグでも同じ効果を再現できるjQueryを紹介します。 デモはこちら。実際のコードは以下です。 html <div class="box"> <figure><img src="https://sole-color-blog.com/manage/wp-content/uploads/2016/03/bgImg01.jpg" alt=""></figure> <p>サンプルです</p> </div>
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
背景画像の拡大・縮小 → background-size ! - シンプルシンプルデザイン CSS
【CSS】background-sizeで背景画像をレスポンシブに設定する方法｜Gimmick log
Android端末でのbackground-sizeでハマった
[18-5] 水玉、ボーダー、チェック柄を作ろう（background-size）
「background」と「background-size」を利用する時は注意しましょー
background-size - CSS: カスケーディングスタイルシート | MDN
TRBL メソッドで background-size を代替する - dskd
CSS3適合UA(iOS7等)に伴うbackground-sizeの指定順に注意｜W3G
background-sizeとグラデーション
ミッションインポッシブル ～background-sizeをIE8に対応させよ～ | 日記の間 | あかつきのお宿
CSS の background-size での cover、contain、auto の違い
フロントエンドこそ覚えたい正規表現：background-size編 | バシャログ。
imgだけどサイズをbackground-size: cover;みたいにしたい - Qiita
background-size CSS property buggy on iOS devices
background のショートハンドで background-size が設定できない - Qiita
background-sizeプロパティについてまとめ ｜ Tips Note by TAM
【CSS3】background-size:cover;で背景全面を画像にする方法（IE8対応）
cssで背景画像のサイズを変えよう！background-sizeまとめ
Androidのbackground-sizeのバグっぽいの
How do I make background-size work in IE?
CSSのbackground-sizeで背景画像サイズを設定する方法を徹底解説!! | 侍エンジニアブログ
CSS3適合UA(iOS7等)に伴うbackground-sizeの指定順に注意｜W3G
IE8でもbackground-sizeを変更する。 - みかづきブログ その3
background-sizeがAndroidで動かない - hokaccha memo