当我使用DOCTYPE时，忽略边距和填充 [英] when I use DOCTYPE, margin and padding are ignored

查看：46 发布时间：2019/6/5 3:49:09 html-css

本文介绍了当我使用DOCTYPE时，忽略边距和填充的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

为什么我的HTML中有DOCTYPE行然后是margin？和

" padding"被忽略了？

在内联和样式表样式中都会发生这种情况。

对于XHTML和HTML文档都会发生这种情况。

它发生在IE6，IE7和Firefox中（没有尝试任何其他）。

当您保存页面时，保证金/填充实际上已从保存中删除

HTML文件（！）。

这是为什么？

在这里你可以看到问题所在：
http://www.tanguay.info/cssissues/xh...ithDoctype.htm

这里没有DOCTYPE线，因此页面很好：
http://www.tanguay.info/cssissues/xh...outDoctype.htm

这里是我的HTML（Valid XHTML 1.0 Strict）：

<！DOCTYPE html PUBLIC" - // W3C // DTD XHTML 1.0 Strict // EN" http：//

www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

< html>

将头部>

将标题>！DOCTYPE /内嵌余量问题的示例< /标题>

将链路HREF =" xhtmlMarginIssue.css"类型= QUOT;文本/ CSS" rel =" stylesheet" />

< / head>

< body>

< p>因为我在此页面上有DOCTYPE，所以< b> margin< / band

< b> padding< / bstyles将被忽略。为什么< BR />

将A HREF =" xhtmlMarginIssueWithoutDoctype.htm">如果我走DOCTYPE

线出来，然后它工作<。 / a>< / p>

< div style =" margin：20 20 20 20; background-color：#ddd; font-size：

24pt;颜色：红色;填充：100 100 100 100"> inline-css div< / div>

< p> div之外的第一句话。 < / p>

< div class =" message"> inside stylesheet-css div< / div>

< p> Second在div之外的句子。< / p>

< / body>

< / html>

解决方案

Scripsit爱德华：

为什么当我在我的HTML一个DOCTYPE线然后"余量" ;和

" padding"被忽略了？

因为当一个合适的DOCTYPE声明出现在<的开头时，浏览器通常表现得更好（符合更符合标准的

方式） br />
文件。谷歌的怪癖模式或者直接访问
http://www.quirksmode.org/ css / contents.html 用于解释。

< div style =" margin：20 20 20 20; background-color：#ddd; font -size：

24pt; color：red; padding：100 100 100 100"> inline-css div< / div>

符合标准的浏览器_must_忽略边距和填充规则，因为

指定的值在语法上是格式错误的（数字后没有单位符号）。

当然，这只是冰山一角。通常你不应该使用

像素值，而是使用余量和填充的em值。

-

Jukka K. Korpela（Yucca）
http：//www.cs .tut.fi / ~jkorpela /

3月20日，11：51，Edward < edw ... @ tanguay.infowrote：

为什么我的HTML中有DOCTYPE行然后是margin？和

" padding"被忽略了？

错误的问题。相反，请问为什么当我_don''t不使用

doctype声明时，浏览器试图猜测什么是粗略的

无效的CSS应该意味着什么使用它。

< div style =" margin：20 20 20 20;

你可能意味着

< div style ="保证金：20px 20px 20px 20px;

在发布问题之前始终验证您的HTML和CSS。

它通常会立即给您答案。

始终在发布问题之前验证您的HTML和CSS。

它会经常给你答案。

以上代码在 http： //validator.w3.org 我认为是
假定是HTML验证的最终权限。

有谁知道更多准确的HTML验证服务？

Why is it when I have a DOCTYPE line in my HTML then "margin" and
"padding" are ignored?

This happens in both inline and stylesheet styles.
It happens for both XHTML and HTML doctypes.
It happens in IE6, IE7 and Firefox (didn''t try any others).
And when you save the page, the margin/paddings are actually REMOVED
from the saved HTML file (!).

Why is this?

Here you can see the problem:
http://www.tanguay.info/cssissues/xh...ithDoctype.htm

And here there is no DOCTYPE line and so the page is fine:
http://www.tanguay.info/cssissues/xh...outDoctype.htm

Here is my HTML (Valid XHTML 1.0 Strict):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Example of DOCTYPE / inline margin issue</title>
<link href="xhtmlMarginIssue.css" type="text/css" rel="stylesheet"/>
</head>
<body>

<p>Because I have a DOCTYPE on this page, the <b>margin</band
<b>padding</bstyles are ignored. Why?<br/>
<a href="xhtmlMarginIssueWithoutDoctype.htm">If I take the DOCTYPE
line out then it works.</a></p>

<div style="margin: 20 20 20 20;background-color:#ddd;font-size:
24pt;color:red;padding: 100 100 100 100">inside inline-css div </div>
<p>First sentence outside the divs. </p>

<div class="message">inside stylesheet-css div</div>
<p>Second sentence outside the divs.</p>

</body>
</html>

解决方案

Scripsit Edward:

Why is it when I have a DOCTYPE line in my HTML then "margin" and
"padding" are ignored?
Because browsers generally behave better (in a more standards-conforming
way) when a suitable DOCTYPE declaration appears at the start of the
document. Google for "quirks mode" or go directly to
http://www.quirksmode.org/css/contents.html for explanations.

<div style="margin: 20 20 20 20;background-color:#ddd;font-size:
24pt;color:red;padding: 100 100 100 100">inside inline-css div </div>
A conforming browser _must_ ignore the margin and padding rules, since the
specified values are syntactically malformed (no unit symbol after number).
Of course, this is just the top of the iceberg. Normally you shouldn''t use
pixel values but em values for margin and padding.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

On 20 Mar, 11:51, "Edward" <edw...@tanguay.infowrote:
Why is it when I have a DOCTYPE line in my HTML then "margin" and
"padding" are ignored?
Wrong question. Ask instead, "Why is it that when I _don''t_ use a
doctype declaration, the browser tries to guess at what grossly
invalid CSS ought to mean and uses that."

<div style="margin: 20 20 20 20;
You probably meant
<div style="margin: 20px 20px 20px 20px;

Always validate your HTML and CSS before posting questions.
It will often give you an answer immediately.

Always validate your HTML and CSS before posting questions.
It will often give you an answer immediately.
The above code validates fine at http://validator.w3.org which I
assumed was the end-all authority on HTML validation.

Does anyone know of a more accurate HTML validating service?

这篇关于当我使用DOCTYPE时，忽略边距和填充的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

当我使用DOCTYPE时，忽略边距和填充 [英] when I use DOCTYPE, margin and padding are ignored

问题描述

相关文章

其他开发语言最新文章

热门教程

热门工具

登录关闭

当我使用DOCTYPE时，忽略边距和填充 [英] when I use DOCTYPE, margin and padding are ignored

问题描述

相关文章

其他开发语言最新文章

热门教程

热门工具

登录 关闭

登录关闭