Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/40.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Css 背景色位置_Css_Background - Fatal编程技术网

Css 背景色位置

Css 背景色位置,css,background,Css,Background,我设置的背景色未应用于整个内容区域内容包装器。它只适用于大约一半的页面 内容的位置在JSFIDLE之外居中 <!DOCTYPE html> <html lang="en-US"> <head> <link rel="stylesheet" href="sidenav3.css" type="text/css"/> <title>web page</title> </head> <b

我设置的背景色未应用于整个内容区域内容包装器。它只适用于大约一半的页面

内容的位置在JSFIDLE之外居中

<!DOCTYPE html>
<html lang="en-US">    
<head>
    <link rel="stylesheet" href="sidenav3.css" type="text/css"/>
    <title>web page</title>
</head>

<body>

<div id="page-wrapper">
    <div id="header"></div>
      <div id="content-wrapper">
        <div id="content">

         <h1>Title</h1>           

<p>
Ham hock turkey flank corned beef beef brisket, chicken tri-tip sirloin ham sausage bresaola drumstick short loin speck. Kielbasa speck chicken flank bresaola, meatloaf frankfurter. Andouille pork chop spare ribs fatback pork loin. Strip steak meatball ribeye, turducken boudin shoulder fatback tongue cow meatloaf ground round short loin. Tri-tip prosciutto chuck capicola jerky. Pastrami chuck turkey, brisket pork belly hamburger corned beef speck.
</p>&nbsp

<p>
T-bone frankfurter meatloaf, ham jerky pork boudin tail short loin. Filet mignon salami sirloin, leberkas sausage short loin pork. Prosciutto biltong kielbasa turkey ribeye brisket. Bacon swine shank, frankfurter boudin short ribs drumstick tongue tail fatback.
</p>&nbsp

<p>Turkey t-bone beef, tenderloin pig drumstick biltong ham turducken. Turducken kielbasa spare ribs t-bone tri-tip. Strip steak speck flank tenderloin. Prosciutto spare ribs flank, turkey rump beef ribs cow biltong tenderloin ham hamburger leberkas pastrami. Leberkas turkey flank capicola short loin kielbasa. Sausage meatloaf shankle venison flank ribeye tail strip steak. Turducken salami rump cow corned beef.
</p>&nbsp

<p>T-bone frankfurter meatloaf, ham jerky pork boudin tail short loin. Filet mignon salami sirloin, leberkas sausage short loin pork. Prosciutto biltong kielbasa turkey ribeye brisket. Bacon swine shank, frankfurter boudin short ribs drumstick tongue tail fatback.
</p>&nbsp

<p>T-bone frankfurter meatloaf, ham jerky pork boudin tail short loin. Filet mignon salami sirloin, leberkas sausage short loin pork. Prosciutto biltong kielbasa turkey ribeye brisket. Bacon swine shank, frankfurter boudin short ribs drumstick tongue tail fatback.
</p>&nbsp            

</div><!-- END content-->

<div id="menu-wrap">
    <div id="menu">
          <ul>
             <li><a href="#">index</a>
                   <ul>
                       <li><a href="#">Item one</a></li>
                       <li><a href="#">Item two</a></li>
                       <li><a href="#">Item three</a></li>
                       <li><a href="#">Item four</a></li>
                       <li><a href="#">Item five</a></li>  
                       <li><a href="#">Item six</a></li>              
                       <li><a href="#">Item seven</a></li>         
                   </ul>
              </li>
          </ul>
     </div><!-- END menu-->
</div> <!-- END menu-wrap-->        

    </div><!-- END content-wrapper-->     
    <div id="footer"></div>
</div><!-- END page-wrapper-->
</body>
</html> 

移除位置:绝对位置


似乎在JSFIDLE示例中解决了这个问题。

删除位置:绝对

似乎在JSFIDLE示例中解决了这个问题。

原因是top:0px;底部:0px基本上强制元素高度为其容器的100%,结果也是视口的100%

移除底部:0px允许内容包装器根据需要及其背景进行扩展:

原因是top:0px;底部:0px基本上强制元素高度为其容器的100%,结果也是视口的100%

移除底部:0px允许内容包装器根据需要及其背景进行扩展:


我无法访问您的网站,但如果我正确地阅读了您的内容,那么在CSS主体组中添加背景颜色元素也可能会有所帮助,这样无论背景如何,背景都会缩放并呈现

body{
      background-color: #f6f6f6;
    }

我希望这有帮助

我无法访问您的网站,但是如果我正确阅读了您的内容,那么如果您在CSS主体组中添加背景颜色元素,那么无论背景如何,背景都将缩放并显示,这可能会有所帮助

body{
      background-color: #f6f6f6;
    }

我希望这有帮助

+1为您的解决方案移除底部;一个比我的+1好得多的解决方案,可以帮你去除底部;比minebackground更好的解决方案:f6f6f6;无论我在哪里应用它,它都不会覆盖整个页面;无论我在哪里应用它,它都不会覆盖整个页面。