行内元素之中不能加入块级元素这是我们众所周知的,比如a里面不能加div,但是如果a标签的display为block,设置其为块级化了,这个时候可以往里面加块级元素吗?
还有一个问题,我们一般会看到这样一种情况,一个列表,里面有很多条数据,我们需要点击每一条数据跳转到指定详情页,而且每条数据之中的结构比较复杂,应该怎么做跳转呢?加a标签?那a标签加在哪里,最外层还是什么?还是要用js做跳转?
第一个问题:跟CSS半毛钱关系都没有,跟doctype声明有关。
在h4的任何doctype声明下,都不允许a嵌套div,而html5的doctype声明下允许a嵌套div。
“a不允许嵌套div”这种约束属于语义约束,与之区别的约束还有严格约束,比如“a不允许嵌套a”。
严格约束在所有的浏览器下都不被允许;而语义约束,浏览器大多会容错处理,生成的文档树可能相互不太一样(由于标准没有定义容错行为)。
因此你才会经常看到“不要在a里面包含div”的说法。它不符合标准,而且可能会导致偏离期望的结果。
可以读一下这篇文章了解更多关于语义嵌套约束在不同浏览器中的不同解析结果。
在http://www.w3.org/TR/html4/loose.dtd里,我们可以找到这样的定义:
这里的inline和block和CSS里面的inline和block有关系吗?
有一定关系,由于HTML划分了这些标签,CSS上才根据语义默认他们是display: inline或display: block。
但他们的关系仅此而已,html层面的inline和block仅仅是区分html标签的方式,和他们最终呈现出来的display属性无关。
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。