締切済み

htmlについての質問です

2012/06/02 18:34

riririnringo
お礼率0% (0/16)

CSS
回答数3
ありがとう数0

みんなの回答 （3）
専門家の回答

みんなの回答

key-child
ベストアンサー率54% (25/46)

2012/06/03 00:06 回答No.3

> で上一列に画像を表示したんですが、 > これとおんなじように下一列に画像を表示したら、 > 上のやつが消えてしまいました。どういう風に記述したの出ていないので、推測になるが、下記で記述したのなら、カスケード処理によって、後から記述した方が有効になる。 body { background-image : url("画像URL"); background-repeat: repeat-x; background-attachment: fixed; /* 上記の同じプロパティが、下記の内容で上書きされる */ background-image : url("画像URL"); background-repeat: repeat-x; background-attachment: fixed; background-position: bottom; } CSS3では、1つの要素に対して、背景の指定が複数おこなうことができるようになっている。なので下記の記述でおこなえる。 body { background-image: url(""), url(""); background-repeat: repeat-x, repeat-x; background-position: top, bottom; background-attachment: fixed, fixed; } Opera, Firefox, Chrome, Safariの最新バージョンで確認済み。 IE8は無理。IEのそれ以降バージョンはわかりません。複数のボックスを使用しておこなうなら、わざわざ新しい要素を追加する必要はないと思われます。 html要素に対しても、背景の指定がおこなえます。 html { background-image : url("画像URL"); background-repeat: repeat-x; background-attachment: fixed; } body { background-image : url("画像URL"); background-repeat: repeat-x; background-attachment: fixed; background-position: bottom; }

ORUKA1951
ベストアンサー率45% (5062/11036)

2012/06/02 20:32 回答No.2

上はよいけど、下はウィンドウの下のことかな？本来、ウィンドウの高さは内容の大きさによって変わるので、ウィンドウの高さを表示域にする設定が必要。　次に、ひとつのブロックにふたつの背景・・・ってないので、もう一つブロックを置くのが簡単 [HTML5} <body> 　<article> 　　<header> 　　</header> 　　<section> 　　</section> 　　<footer> 　　</footer> 　</article> </body> [HTML4.01] <body> 　<div class="article"> 　　<div class="header"> 　　</div> 　　<div class="section"> 　　</div> 　　<div class="footer"> 　　</div> 　</div> </body> [CSS for HTML5/HTML4.01] html,body{margin:0 auto;height:100%;position:relative;} body{background:url() repeat-x fixed;} article,div.article{height:100%;backckground:url() repeat-x bottom left fixed;}