Html 内联元素内的块级元素
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/1714121/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Block Level Elements inside Inline elements
提问by aidan
The W3C Validator tells me I can't put block-level elements inside inline elements. Makes sense...
W3C 验证器告诉我不能将块级元素放入内联元素中。说得通...
but what if I'm using CSS to change that block-level element into an inline element?
但是如果我使用 CSS 将块级元素更改为内联元素呢?
And what if I'm using CSS to convert an inline element into a block-level element (when inside another inline element)?
如果我使用 CSS 将内联元素转换为块级元素(当在另一个内联元素内时)怎么办?
The Validator doesn't pick up on this obviously, but is it wrong?
Validator 显然没有注意到这一点,但这是错误的吗?
(I'm not actually doing this, I'm just wondering about best-practice)
(我实际上并没有这样做,我只是想知道最佳实践)
回答by anddoutoi
An element defined as a block element in the HTML specification is not the same as a element defined as display: block;
in CSS.
在 HTML 规范中定义为块元素的元素与display: block;
在 CSS 中定义的元素不同。
With this I mean: Even if you say <p style="display: inline;">Lorem...</p>
. The <p>
will still be a block element in the eyes of HTML.
我的意思是:即使你说<p style="display: inline;">Lorem...</p>
. 该<p>
仍将处于HTML眼中的块元素。
HTML, CSS and JavaScript if used right is said to have loose couplingtoward each other and that one should not be dependent of another and that the absence of one should not make the others (or the system as whole) fail.
如果使用得当,HTML、CSS 和 JavaScript 被认为彼此之间具有松散耦合,一个不应该依赖另一个,并且缺少一个不应该使其他(或整个系统)失败。
回答by Blixt
An element that is inline elements should not contain block elements. Block elements can contain block and/or inline elements while inline elements can only contain other inline (including inline-block
, such as <img>
) elements.
作为内联元素的元素不应包含块元素。块元素可以包含块和/或内联元素,而内联元素只能包含其他内联(包括inline-block
,例如<img>
)元素。
You can of course do it anyways, since the graphical representation will be pretty consistent across browsers. It's still not something I'd recommend though, and can't really think of a reason to do it either.
你当然可以这样做,因为图形表示在浏览器中将非常一致。尽管如此,这仍然不是我推荐的东西,也想不出这样做的理由。