css背景颜色格式化问题_Css_Html

css背景颜色格式化问题

css html

css背景颜色格式化问题,css,html,Css,Html,我有一个关于我的主体分区的白色背景的问题。我必须指定一个固定的px，这是750px。我不想这样做，我只想能够使用汽车。这是因为我需要对其他页面使用相同的CSS文件，它们的高度将不同。此外，在人体模型div上使用height:auto的值时，它会覆盖该div中的所有内容这里有一个链接，看看它是什么样子请你能帮我解决这个问题吗以下是我的HTML代码： <!doctype html> <head> <meta charset="UTF-8"> <tit

我有一个关于我的主体分区的白色背景的问题。我必须指定一个固定的px，这是750px。我不想这样做，我只想能够使用汽车。这是因为我需要对其他页面使用相同的CSS文件，它们的高度将不同。此外，在人体模型div上使用height:auto的值时，它会覆盖该div中的所有内容

这里有一个链接，看看它是什么样子

请你能帮我解决这个问题吗

以下是我的HTML代码：

<!doctype html>
<head>
<meta charset="UTF-8">

<title>Home || Web Design Coursework</title>

<meta name="description" content="">

<meta name="author" content="Elliott Davidson">

<meta name="language" content="english">

<link rel="shortcut icon" href="images/favicon.ico">

<link rel="stylesheet" type="text/css" media="screen" href="css/main.css">

</head>

<body>

<div id="container">

    <!-- start of header -->

    <div id="header">

        <img src="images/header-image.png" width="980" height="170" alt="kayaking header logo" /> </div>

    </div><!-- end of header -->

    <!-- start of navigation bar -->

    <div id="navmenu">

        <ul id="list-nav">

            <li id="topnavleft"><a href="index.html">Home</a></li>

            <li><a href="design.html">Design</a></li>

            <li><a href="about.html">About</a></li>

            <li><a href="kayaking-di">Kayaking Disciplines</a></li>

            <li id="topnavright"><a href="links.html">Useful links</a></li>

        </ul><!-- ul end list-nav -->

    </div><!-- div end navmenu -->

    <div id="mainbody">

        <div id="homepagevideo">

            <iframe width="560" height="315" src="http://www.youtube.com/embed/3WabVsBugGQ?rel=0" frameborder="0" allowfullscreen></iframe>

        </div><!-- end div homepagevideo -->

        <div id="homepagekayakingdisciplines">

            <h1 id="homepageh1kayakingdiscipline">Kayaking Disciplines</h1>

            <p>Aliquid delicatissimi et vix. Ut cum tation ridens. Mea ei impetus gubergren, sit natum doming quodsi et. Usu cu sonet debitis. Mea nullam tamquam ea. Ex vis vocibus splendide, ut eum ullum assum impedit.</p>

            <p>Decore facete mei ei. Eam ea maluisset dissentias, graece labore ocurreret has eu. Cu usu quem officiis maiestatis, cu quis assueverit mea. Primis deserunt consectetuer quo et, vim numquam aliquam eruditi ut.</p>

            <p>Sint erroribus imperdiet ex quo, et sit habeo dolorum molestiae, commodo dissentiet no duo. Mucius essent repudiare te pri, te tale accumsan reprimique pro. Mel cu ignota argumentum. Vis dolor efficiantur ex, ei mei reque oporteat percipitur. Sea corrumpit voluptaria referrentur ea, ei sensibus definitionem vel. No verterem elaboraret sit, velit apeirian vim ea.</p>

        </div><!-- end div homepagekayakingdisciplines -->

        <div id="homepagedesign">

            <h2>Design</h2>

            <p>Dicat adversarium nam at, ei saepe dictas pri. Ad aliquid meliore fastidii pro, duo appareat apeirian ea, vix ei maiorum luptatum quaerendum. Est ut vivendum oportere efficiendi, vim et brute nusquam, justo accumsan inimicus ex vis. Eum dicant mollis denique cu, an fastidii ocurreret instructior sit. His discere mediocrem no, an sit recteque tincidunt.</p>

<p>Mea ea animal inciderint, cum nulla saepe libris an. Modo meliore argumentum vel ei, mei cu option facilisis. Et enim detraxit vix. In clita mollis feugiat quo. Nobis soluta pri te, cum brute latine cotidieque ei.</p>

        </div><!-- end div homepagedesign -->

        <div id="homepageaboutme">

            <h3>About</h3>

            <p>Dicat adversarium nam at, ei saepe dictas pri. Ad aliquid meliore fastidii pro, duo appareat apeirian ea, vix ei maiorum luptatum quaerendum. Est ut vivendum oportere efficiendi, vim et brute nusquam, justo accumsan inimicus ex vis.</p>

        </div><!-- end div homepageaboutme -->

        <div id="homepagelinks">

            <h3>Links</h3>

            <p>Dicat adversarium nam at, ei saepe dictas pri. Ad aliquid meliore fastidii pro, duo appareat apeirian ea, vix ei maiorum luptatum quaerendum. Est ut vivendum oportere efficiendi, vim et brute nusquam, justo accumsan inimicus ex vis.</p>

        </div><!-- end div homepagelinks -->

    </div><!-- end div mainbody -->

    <div id="footer">

        <div id="footerimage">

            <img src="images/footer-waves.jpg" width="980" height="140" alt="waves" />

            <div id="footertext"> 

                <div id="footernavmenu">

                    <ul id="list-footer-nav">

                        <li><a href="index.html">Home</a></li>

                        <li><a href="design.html">Design</a></li>

                        <li><a href="about.html">About</a></li>

                        <li><a href="kayaking-di">kayaking Disciplines</a></li>

                        <li><a href="links.html">Useful links</a></li>

                    </ul><!-- ul end list-footer-nav -->

                </div><!-- div end footernavmenu -->

                <div id="copyright">

                    <div class="copyrigttext">

                        Copyright © 2013 Elliott Davidson, All Rights Reserved.

                    </div><!-- end div copyrighttext -->

                </div><!-- end div copyright -->

            </div><!-- end div footertext -->          

        </div><!-- footer image --> 

    </div><!-- end of footer -->

</div><!-- end of container -->

</body>
</html>

您只需要添加一个

溢出：auto到您的#主体
。就这样
#mainbody {
    background-color:#FFF;
    width:980px;
    margin-left:auto;
    margin-right:auto;
    margin-top:-19px;
    overflow:auto; /* Use THIS one */
}

您可以通过在关闭mainbody
div之前添加这样一个清晰的命令来完成此操作，如下所示
HTML
<div class="clear"></div>

您认为我们可以通过查看您的完整网页代码来帮助您吗？以总结的方式提问。我如何做到这一点是存储在本地计算机上的？你必须知道哪个部分出了问题，然后才可以提问。我确实知道主体部分的背景大小trybackground size:cover和背景大小：包含-@user3070541您将它们添加到哪里@user3070541在#mainbody div的csscan中，您创建了一个问题的jsfiddle并提供了一个链接？-@用户3070541在主答案中编辑了相同的内容。-@用户3070541
<div class="clear"></div>

.clear {
clear:both;
}