背景画像を複数指定する。
通常1つの要素に対して背景画像は1枚しか指定できませんが、
CSS3では複数画像を指定することができます。
例として下記の2枚の画像を使ってみます。
.bgimg {
background:url("sample1.jpg") no-repeat right bottom, url("umi.jpg");
width:400px;
height:300px;
color:#FFF;
}
この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。この文章はダミーです。
上記コードのように、backgroundプロパティで、
カンマ「,」で区切ることで複数の画像をすることができます。
※なおIE8以下では対応していません、IE9からは対応しているようです。
こちらはＩＥ９ですが、デモ画像が表示されません。
コメントありがとうございます。
「デモ画像が表示されない」ということですが、
IE9のブラウザモードが、IE9互換表示になっていないでしょうか？
当環境で見た所、IE9換表示になっていると表示されていませんでした。
IE9互換表示になっていました。
表示できました。ありがとうございました。