我无法摆脱body
元素的填充。我尝试在padding: 0px 0px 0px 0px
元素上设置body
,但是它什么也不做。我也尝试过将padding-top
和padding-left
设置为0
,但是它什么也没做。
我确保#container
内的body
没有边距,我尝试将margin: 0
和margin-left
margin-right
设置为{ {1}}。
0
区域为blue
,白色区域为body
。我正在尝试拉伸容器以覆盖整个身体(摆脱蓝色)。
相关CSS :
#container
创建容器的js :
html {
padding: 0;
}
body {
display: flex;
flex: 1 0 100%;
background-color: blue;
padding: 0;
}
答案 0 :(得分:0)
我在.app
元素内有一个名为body
的容器,并将其CSS设置为:
.app {
display: flex;
flex: 1 0 100%;
background-color: black;
margin: -8px -8px 0px -8px;
}
关键部分是:
margin: -8px -8px 0px -8px;
注意:我以为margin
是10px
,但实际上是8px
。
答案 1 :(得分:0)
在每个属性的末尾使用!important。强制忽略默认浏览器CSS并应用您的CSS。
html
{
padding: 0 !important;
}
一些开发人员还使用它来重置浏览器CSS。
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
但是,我的建议是先使用!important选项,然后重置所有浏览器CSS,因为,这还会干扰您网页的其他内容。