■--ページの半分を特定の色で埋め尽くす方法 >>>もに -- 2004/01/20-12:17..No.[9789] |
|||
はじめまして、「もに」と申します。 いきなり質問ですが、タイトルの通り ページ全体の半分を、特定の色で埋め尽くす方法を探しています。 ただ、いくつか条件があって ・フレーム分割は使わない ・テーブルも使わない ・ウィンドウサイズをどのように変化しても、確実に画面半分の 色が変わっている というものなのですが、果たしてこれで実現できるでしょうか? スタイルシートを使ってやってみたのですが、background-colorと background-positionは同時に有効とならないのか、どうも上手くいきません。 何かアドバイスがありましたらよろしくお願いします。 |
|||
>>> No. -- 2004/01/20-12:34..No.[9790] |
|||
positionとcolorは同時に有効になるはずですが、 どのように指定なさいましたか? お約束にもあるように、また特に表示に関するトラブルの場合 その問題の起きているページを実際に見ることで 問題の解決が速やかになります。 |
|||
>>> もに -[URL] -- 2004/01/20-13:11..No.[9791] |
|||
No.さん、ご返事ありがとうございます。 とりあえず自己解決したので、結果のURLを記入しておきます。 (TOPからはデッドリンクですが、今日限りのアップですのでご容赦を) >positionとcolorは同時に有効になるはずですが、 >どのように指定なさいましたか? そのときは BODY { background-color: #3333aa; background-position: 50%; } とやってみました。 が、これでは上手くいきませんでした。 結局、 background-imageとbackground-positionを併用し、 背景画像を実際に半分だけ色塗りして対応しました。 (ファイルサイズ節約の為、横に細長い画像にして 縦方向にrepeat表示させてあります) colorとpositionを使って出来る方法があれば、 念のため教えていただけると有難いです。 |
|||
>>> らくらく -- 2004/01/20-15:01..No.[9792] |
|||
上下半分なのか左右半分なのかわかりませんが、仮に上下半分として 上半分に塗りたい色の画像を用意してimgタグで貼り付け、その画像に対し position:absolute;top:0;left:0;width:100%;height:50%;z-index:-1; みたいな感じで設定してやったらできましたよ。 実際には100%では少し隙間が空くので、もう少し数値を大きくする必要がありそうですが。 下半分に塗りたい色はbackground-colorで設定してください。 左右半分だとするとheightの値の取り方が少し難しいですが、できないことはないと思います。 |
|||
>>> もに(解決) -- 2004/01/20-15:47..No.[9794] |
|||
ありがとうございました。 後学の為に、いろいろ試してみようと思います。 |
|||