身体背景颜色不会出现?

时间:2013-05-29 02:17:47

标签: css

经过几个小时的研究,我仍然无法上班。

我想在网站的背景中添加颜色或纹理图像,但它会保持白色。

相关的CSS是:

#html {
    min-height: 100%;
}

#body {
    min-height: 100%;
    overflow: hidden;   
    margin: 0px;
    padding: 0px;
    font-family: "Lucida Console", Monaco, monospace;   
}

和HTML。它有点乱,因为我是一个菜鸟。

<body>
    <div id="ribbon">
        <div id="container" style="height: 100%;">
            <div id="social_and_music">
                <div id="audioplayer">
                    <audio controls>
                        <source src="horse.ogg" type="audio/ogg">
                        <source src="horse.mp3" type="audio/mpeg">
                        Your browser does not support the audio element.
                    </audio>
                </div>
                <div id="social">
                    <a href="#"><img src="images/facebook.png" width="32" height="32" /></a>
                    <a href="#"><img src="images/twitter.png" width="32" height="32" /></a>
                    <a href="#"><img src="images/lastfm.png" width="32" height="32" /></a>
                    <a href="#"><img src="images/myspace.png" width="32" height="32" /></a>
                </div>
            </div>
            <div id="header"></div>
            <div class="nav" id="nav1"><a href="#">HOME</a></div>
            <div class="nav" id="nav2"><a href="#">MUSIC</a></div>
            <div class="nav" id="nav3"><a href="#">SHOWS</a></div>
            <div class="nav" id="nav4"><a href="#">CONTACT</a></div>
            <div id="main_content">
                <div id="main_img"></div>
                <div id="second_image">
                    <div class="widget_iframe" style="display:inline-block;width:100%;height:200px;margin:0;padding:0;border:0;">
                        <iframe class="widget_iframe" src="http://www.reverbnation.com/widget_code/html_widget/artist_3258446?widget_id=52&posted_by=artist_3258446&pwc[design]=default&pwc[background_color]=%23333333&pwc[layout]=compact&pwc[show_map]=0&pwc[size]=fit" width="100%" height="100%" frameborder="0" scrolling="no">SHOWS</iframe>
                        </center>
                    </div>
                </div>
            </div>
        </div>
        <div id="leftbox">
            <div id="imgA" class="img"></div>
            <div id="imgB" class="img"></div>
            <div id="imgC" class="img"></div>
            <div id="imgD" class="img"></div>
        </div>
        <div id="rightbox">right</div>
        <div id="footer">Content for footer goes here</div>
        <div id="bottom">STEREO WARFARE COPYRIGHT 2011 ARIEL MEHRBAN</div>
    </div>
    </div>
    </div>
    <div id="push"></div>
</body>

3 个答案:

答案 0 :(得分:4)

我认为你的CSS应该是:

html {
    min-height: 100%;
}

body {
    min-height: 100%;
    overflow: hidden;   
    margin: 0px;
    padding: 0px;
    font-family: "Lucida Console", Monaco, monospace;   
}

在html页面上你应该这样:

<html>
    <body>
        <!-- ... -->
    </body>
</html>

当你输入#时,表示你正在使用像

这样的id

的CSS:

#text{
    background-color:#aaa;
}

HTML:

<html>
    <body>
        <input type="text" id="text"/>
    </body>
</html>

答案 1 :(得分:1)

尝试在body标签中添加图片,这在任何浏览器中都可以正常工作。

<!DOCTYPE html>
<html>
<head>
</head>
<body background="imagename.jpg">
<p>some text</p>
</body>
</html>

答案 2 :(得分:0)

我正在使用我的html和css代码作为背景颜色。

HTML

<div class="wrapper">

CSS

wrapper {
    width: 900px;
    height: 800px;
    background-color: #ffffff;
    margin: 0 auto;
}