|
1-html 嵌套标准留意点
1-1块级元素个别作为大容器,能够嵌套:文本,块级元素,行内元素,行内块元素等;然而,p标签中不要嵌套div标签,p,h,等块级标签;
1-2-a标签内能够嵌套恣意元素,然而,a标签不克不及嵌套a标签;
2-留意点
2-1大标签嵌套小标签。是父子;
2-2块级嵌套行内
p标签不克不及嵌套嵌套h1~h6;
h1~h6不克不及嵌套p标签
一个段落,一个是标题;
3-1-1测试 p标签不克不及嵌套div;代码截图:

3-1-2 阅读器显示:

小结,右键反省,显示阅读器自动闭合了两个p标签,强迫不许p标签嵌套h1和div标签;
3-2-1 p标签嵌套其余标签,好比
span,b,strong,i,em,s,del,u,ins,ins,small,big,sub,sup;
3-2-2 测试代码截图:

阅读器截图:

小结,嵌套标签后阅读器显示正常,反省图如下;反省后,未发现强迫闭合标签;


4-1 测试a标签,a标签不克不及嵌套a标签;
代码截图:

阅读器显示和阅读器反省截图:

小结,当a标签嵌套a标签后,显示阅读器点击反省后,看到标签被强迫闭合,使其不克不及被嵌套;
反省显示a标签嵌套h1,div标签时,显示正常;
4-2 测试a标签嵌套其余标签,代码和阅读器显示截图;

阅读器反省截图


小结,阅读器显示a标签嵌套后,文本显示正常,阅读器反省正常,无强迫闭合;
a标签嵌套标签后,一切字体变为蓝色,点击后变色,而且,自带下划线;
a标签嵌套标签后,不会自动换行,需求添加br换行进行比较参照。 |
|