0

我有以下代码,例如:

JSFiddle:http: //jsfiddle.net/ntcg3/4/

HTML:

<html>
    <p class="hey">hi</p>
</html>​​​​​​​​​​​

CSS:

.hey {
    width:100%;
    background-color:red;
    margin:0;
    padding:0;
}

​</p>

页面右侧仍有一些填充。

我怎样才能摆脱那个填充,使红色背景颜色延伸到页面的最后?

4

7 回答 7

1

试试这个:

display:block;
text-align:right;

你会得到你需要的输出

于 2012-09-07T06:34:37.343 回答
0

尝试使用以下 CSS

*{margin:0; padding:0}
于 2012-09-07T06:28:27.733 回答
0

当您默认创建 HTML 页面时,<body>以及其他一些元素,如段落标签 ( <p>)、标题标签 ( <h1><h2>.. <h6>) 等...具有默认paddingmargins

因此,您需要通过添加以下 css 来清除这些边距:

html, body, p, h1, h2, h3, h4, h5, h6 {
    margin:0;
    padding:0;
}

有关更多详细信息,请参阅CSS 重置

重置样式表的目标是减少浏览器在默认行高、页边距和标题字体大小等方面的不一致。

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;
}
于 2012-09-07T06:33:51.680 回答
0

试试这个:

.hey {
    width:100%;
    margin:0; 
    padding:0;
    background-color:red;
}
于 2012-09-07T06:34:52.147 回答
0

你应该知道,浏览器给元素添加了自己的样式,和在 ul 标签上创建的边距一样,在 body 标签上也有一个边距。我建议首先检查元素(大多数浏览器上的 control + shift + c ),以便您熟悉这些生成的样式,或者有许多“重置” css 文件首先从样式中删除填充和边距或其他类似的东西

总之,如果你包括: html, body { margin: 0; 填充:0;它将确保 html 和 body 标签不使用任何边距或填充

于 2012-09-07T06:36:15.357 回答
0

在您的 css 文件的开头,您需要重置这些值。

html, body, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead,  article, aside, dialog, figure, footer, header, hgroup, nav, section {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%; }  

它会将您的所有默认值重置为零。

于 2012-09-07T06:36:33.780 回答
0

尝试设置;

body,html{
    padding: 0;
    margin: 0;
}

是工作小提琴。

于 2012-09-07T06:36:47.960 回答