HTML列表的类型

最新推荐文章于 2024-07-26 14:13:35 发布

原创最新推荐文章于 2024-07-26 14:13:35 发布 · 1.5k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#html #css #class

本文详细介绍了如何使用CSS来格式化不同类型的HTML列表，包括有序列表、无序列表和定义列表。通过具体的示例展示了如何单独调整列表项和列表标记的颜色等属性。

一、有序(编号)列表
<ol>
    <li>在css中如何格式化列表</li>
    <li>在css中如何格式化列表</li>
    <li>在css中如何格式化列表</li>
    <li>在css中如何格式化列表</li>
</ol>

二、无序列表
<ul>
    <li>在css中如何格式化列表</li>
    <li>在css中如何格式化列表</li>
    <li>在css中如何格式化列表</li>
    <li>在css中如何格式化列表</li>
</ul>

三、定义列表
<dl>
    <dt>CSS</dt><dd>在css中如何格式化列表</dd>
    <dt>CSS</dt><dd>在css中如何格式化列表</dd>
    <dt>CSS</dt><dd>在css中如何格式化列表</dd>
    <dt>CSS</dt><dd>在css中如何格式化列表</dd>
</dl>

标记和列表项使用相同的字体特性显示。如果希望只更改标记或列表项的属性，可以使用<span>或其他内联元素，如：
<ol>
<li><span class="person">Nick Mamatas</span></li>
<ol>

ol {color:black;}
ol li {color:red;}
ol li span.person{color:black;}