1 HTML元素大全 _生活百科

文章插图
01、基础元素<h1/2/3/4/5/6>标题从大h1到小h6，块元素，有6级标题。是一种标题类语义标签，内置了字体、边距样式。

合理使用h标签，主要用于标题，不要为了加粗效果而随意使用。
h1用于最重要的标题内容，会被搜索引擎使用，用得太多影响SEO效果。

<h1 align="center">标题标签h1/2/3/4/5/6：一级标题</h1><h2>2级标题</h2><h3>3级标题</h3><h4>4级标题</h4><h5>5级标题</h5><h6>6级标题</h6>

属性描述值align标题的水平对齐方式left、center、right段落元素段落元素内容（**paragraph **/?p?r?ɡrɑ?f/ 段落、分段）块元素，表示一个内容段落，前后自动换行，段落之间会有间隙（默认margin上、下=1em），比 的行间距更大。
段落文字1段落文字2 012普通文字1，用br换行 普通文字1

文章插图
 换行换行元素（Break）： ，单标签，默认行间距。HTML中不识别输入的回车换行，需用 标签换行。
<hr>水平线水平线元素：<hr>，单标签，有颜色color、长度width、粗细size、对齐align等属性，CSS中可用border设置样式。

<br><hr width="80%" color="green" align="left" size=1 /><hr width="80%" color="green"/><hr width="300px" color="red" size="3" />

文章插图
属性描述值color线颜色颜色width宽度像素、百分比size线粗细整数，像素align水平对齐方式，left、center、right<ul-li/ol-li>列表标签列表都是块元素，li中可以放任何东西，常用来组织列表相关内容，如商品列表、树形结构、导航等。

无序列表<ul><li></li></ul>：unordered list，li为列表项，属性type可定义符号样式，默认disc（实心圆）。
有序列表<ol><li></li></ol>：ordered list，li为列表项，属性type可定义排序样式，默认1（数字）。

属性描述值/示例type序号类型无序列表：disc=实心圆、square=方块、circle=空心圆有序列表：1=数字、a/A=字母、i/I=阿拉伯数字start有序列表：序号开始的值，默认1<ol type="1" start="4">reversed有序列表：倒序排列<ol type="1" reversed ><li>的属性value有序列表：设置序号值，会影响后面<li type="I" value="https://www.huyubaike.com/biancheng/5">

<ul type="disc"><!-- type可定义符号样式，默认disc=实心圆 ， 可自定义样式取代--><li type="square">l1<!--square=方块--><ul><li>l1的嵌套子节点</li></ul></li><li type="circle">l2</li><!--circle=空心圆--><li>l3</li></ul><ol type="1"><!-- type可定义排序样式，默认1=数字--><li type="a">l1</li><!-- a=小写字母排序--><li type="A">l2</li><!-- A=大写字母排序--><li type="i">l3</li><!-- i=小写阿拉伯字母排序--><li type="I">l4</li><!-- I=大写阿拉伯字母排序--><li>l5</li></ol>

文章插图

无序标签、有序标签可以多层（相互）嵌套。
列表项中的内容可以是文本，也可以是其他标签，如图片img、a标签。
使用场景：新闻列表，导航按钮。
list-style-type：在css中设置列表符号样式，如ul li{list-style-type:disc} ``ol li{}，枚举值-菜鸟教程。
disc、circle...：实心、空心符号
decimal...：数字