html5中常见的列表有哪些

1.无序列表

<ul>

<li>Coffee</li>

<li>Milk</li>

</ul>

2.有序列表

<ol>

<li>Coffee</li>

<li>Milk</li>

</ol>

3.自定义列表

<dl>

<dt>Coffee</dt>

<dd>Black hot drink</dd>

<dt>Milk</dt>

<dd>White cold drink</dd>

</dl>

li标签在html中大多作为导航或信息列表的结构。其实li配合list-style-type和list-style-position可以方便的设置小圆点或三角箭头。注意list-style-position: inside需要设置为inside设置在盒模型内才能生效。

除去list-style-type设置图标，可以用常规的relative配合absolute来设置箭头或者圆点等。

css样式去控制。css选择器:nth-child(n)n值为要选择的第几个子项。例如：

<ul>

<li>第一子项</li>

<li>第二子项</li>

<li>第三子项</li>

<li>第四子项</li>

</ul>

选择到第三个子项后变它的字体颜色：

li:nth-child(3)

{color:#f00}

当然也可以用js去选择控制了：

这里我用个jq的属性选择器:eq(index)，这里的index值是从0开始的。继续用上面的例子：

$('ul

li:eq(2)').css('color','#f00')

这样也能实现第三个子项字体颜色的改变

---