身体被向下推

body being pushed down

本文关键字:下推      更新时间:2023-09-26

我一直在这个网站上工作,http://hidden.xx问题是<body>被从顶部向下推了大约20px。这导致了页面底部的问题,你可以看到背景梯度在最后20像素重复。如果你试图去掉firebug或任何其他面板,重复发生的区域会变得更大。

我试过解决这个问题,但萤火虫没有给我任何线索来说明是什么导致了这种行为。我试着将主体绝对定位在顶部,这就解决了问题,但如果你从浏览器底部弹出一个面板,比如firebug等,则重复区域会再次出现。

编辑:有两个问题,第一个问题是保证金崩溃问题,多亏了@zzzzBov才得以解决。第二个问题是通过向主体添加background-repeat:repeat-x;来解决的,这要归功于@Alex

保证金再次崩溃!

#wrapper上的裕度随着body而塌陷。您可以将其更改为padding: 20px 0margin: 0 auto;

这样尝试:

body{ background: -moz-linear-gradient(#377AA8, #589CCB) repeat-x scroll 0 0 #579BCA; }

只将背景重复到"X"(水平(,并将背景颜色设置为渐变的最浅颜色。

在没有看到样式表的情况下,我建议尝试清除body标记上的paddingmargin(将它们设置为0(。如果失败,那么我建议在导航栏上清除这两个选项。

将第3行中的背景颜色更改为#589CCB:

html {   background-color: #589CCB;}
/* line 20, ../sass/screen.scss */
body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    background: #589CCB; /*OLD: background: #377aa8;*/
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #377aa8), color-stop(100%, #589ccb));
    background-image: -webkit-linear-gradient(#377aa8, #589ccb);
    background-image: -moz-linear-gradient(#377aa8, #589ccb);
    background-image: -o-linear-gradient(#377aa8, #589ccb);
    background-image: -ms-linear-gradient(#377aa8, #589ccb);
    background-image: linear-gradient(#377aa8, #589ccb);
    }