Container-level and text-level tags in HTML, block-level elements and inline elements in CSS are the four nouns we often compare (the inline block level is not considered at the moment). Note: If the label is nested incorrectly, a browser parsing error may occur, just for nesting.
Container label
1、容器级的标签可以简单的理解为能嵌套其它所有标签的标签。2、常见容器级的标签: div h ul ol dl li dt dd ...。
Text labels
1、文本级的标签对应容器级标签,只能嵌套文字/图片/超链接的标签。2、常见文本级的标签:span p buis strong em ins del ...。
Block-level elements
1、css中的块级元素基本与html中的容器级标签对应,包括: **p** div h ul ol dl li dt dd ...。2、*ps:不用刻意去记忆哪些标签是文本级的哪些标签是容器级, 在企业开发中一般情况下要嵌套都是嵌套在div中, 或者按照组标签来嵌套(ul>li, ol>li , dl>dt+dd).*
In-line elements
1、行内元素也基本与文本标签对应:span buis strong em ins del。
Block-level elements and inline elements
1. Block-level elements are exclusive to one row, and inline elements are not exclusive.
2. If the width height is not set, the block-level element defaults to the parent element, and the setting is displayed as set;
Inline elements cannot be set to a wide height, and the default is consistent with what is contained.
PS: In order to enable the element to be able to not monopolize a row, but also can set the width and the height, then appears the inline block level element
Toggle display Mode in CSS
You can set the display mode by displaying the label's properties.
Display Fetch value
1、block 块级2、inline 行内3、inline-block 行内块级
HTML container labels and text labels