web-dev-qa-db-ja.com

cssでページ全体の背景色を設定する方法

yumdom.com のページの背景色を黄色に設定しようとしています。

私は次を試してみましたが、失敗します：

body{ background-color: yellow;} /*only a sliver under the header turns yellow.*/

#doc3{ background-color: yellow;} /*result same as above*/

#bd { background-color: yellow;} /*result same as above*/

#yui-main { background-color: yellow;} /*a rectangle turns yellow ending at where the content ends. I want this rectangle to extend all the way to the footer.*/

また、開発者ツールでChrome上のhtml要素のいずれかを強調表示すると、ページの特定の部分のみが強調表示されます。フッターとコンテンツの下のセクションはun -強調表示。

ヘッダーとフッターの間のスペース全体を黄色で埋め、空白を残さないようにします。

YUI Reset、Fonts、Grids CSSテンプレートV 2.8.0r4を使用していることに注意してください。

どうもありがとう！

htmlcssjquery-ui-css-framework
15
rostam

私はすでにこれに対する答えを書きましたが、削除されたようです。問題は、YUIがbackground-color:whiteをHTML要素に。私はそれを上書きし、そこからすべてが簡単に処理できました。

3
rostam
<html>
  <head>
    <title>
        webpage
      </title>
</head>
  <body style="background-color:blue;text-align:center">
    welcome to my page
    </body>
  </html>
8
Srilekhya

問題は、ページの本文が実際に表示されないことです。下のDIVの幅は100％で、背景CSS自体を上書きする背景色があります。

無人の土地を修復するには、これでうまくいくかもしれません。エレガントではありませんが、機能します。

#doc3 {
    margin: auto 10px;
    width: auto;
    height: 2000px;
    background-color: yellow;
}
5
Brian Hoover

ボディのサイズは動的であり、コンテンツのサイズと同じ大きさです。 cssファイルでは、次を使用できます。* {background-color: black} //すべての要素の背景が黒になりました。

または

html {background-color: black} //ページの背景が黒になり、すべての要素は同じままです。

3
IvanSoria_54

ソースコードを確認し、黄色に変更することを見つけました。黄色の背景色を追加する必要があります：＃left-padding、＃right-padding、html、＃hd、＃main、および＃yui-main。

それがあなたが望んでいたことを願っています。またね

enter image description here

3
David 'mArm' Ansermot

yellowを#doc3に設定し、#yui-mainで呼び出されるwhiteを取り除く必要があるように見えます#doc3）の色。これにより、ヘッダーとフッターの間が黄色になります。

0
ScottS