身体被向下推
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 0
和margin: 0 auto;
这样尝试:
body{
background: -moz-linear-gradient(#377AA8, #589CCB) repeat-x scroll 0 0 #579BCA;
}
只将背景重复到"X"(水平(,并将背景颜色设置为渐变的最浅颜色。
在没有看到样式表的情况下,我建议尝试清除body
标记上的padding
和margin
(将它们设置为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);
}
相关文章:
- HTML内容下推到固定背景图像下方
- Z-Index 和定位:项目在使用“Particleground”Jquery 插件时不断向下推
- 如何让 Bootstrap 3 在下拉点击时向下推送页面内容
- 在Firefox和IE中,向按钮添加填充可以向下推其他按钮
- 文本区域,在您键入时展开并向下推送其下方的内容
- 全宽子菜单,将内容向下推
- 如何在不更改属性数据类型的情况下推送对象数组
- 如何使用 jquery 计算选项卡的高度以向下推页脚
- 将 Bootstrap 3.0 标签直接放置在输入字段的顶部,而无需向下推送内容
- 我的下拉菜单会向下推其他所有内容
- Cordova/PhoneGap在没有服务器的情况下推送通知
- 如何在水平菜单中以绝对位置向下推送内容
- 如何下推表格中的元素- HTML
- 当导航栏固定为粘性导航时,导航链接从导航栏向下推
- 点击图像(下推效果)
- 防止jQuery滑下菜单下推其他列中的元素
- 身体被向下推
- Javascript -添加顶部固定条,并将所有其他元素向下推
- 下拉菜单向下推内容
- 如何用CSS下推整个页面