HTML布局

块级元素

通常在页面显示中独占一行的元素。如div，标题标签h1~h6，p等元素

内联元素

 在页面中可以与其他元素同在一行的元素。如span，a，img等元素。内联元素在设置宽高时无效。

行内块元素

 由内联元素或块级元素转换而成，常用于给内联元素设置宽高。

显示模式的转换

 不管时内联元素还是块级元素都可以通过display进行元素显示模式的转换

display:block;转换为块级元素

display:inline;转换为内联元素

display:inline-block;转换为行内块元素

div元素

 在页面中设置了一块区域，用来包含其他HTML元素，默认情况下宽度等于显示屏宽度，高度取决于包含其他元素所占的宽度

span元素

 无特殊意义，通常用来给一段文字中需要设置不同样式的字段添加不同效果。

语义元素

 就是有特殊意义的元素，例如：form表单，table表格，img图像等。而无语义的元素就是没有特殊意义的元素，如：div，span等元素。

用于布局的语义元素

header元素：页面的头部区域。用于展示一些活动，或者放网站的logo与搜索框。

nav元素：定义导航部分

aside元素：主要内容之外的内容，比如侧边栏

article元素：主要呈现的内容

section元素：定义页面中的章节，页眉，也叫等

footer元素：包含网站的信息，版权

figure元素：规定独立的流内容如图片，代码，图表

figcaption元素：定义figure元素的标题，通常放在figure的第一子元素或最后一个子元素

<figure><img src="./八重樱.png"><figcaption></figcaption></figure>

这篇好文章是转载于：学新通技术网