html无序列表标签和有序列表标签使用实例详解
程序员文章站
2022-03-31 08:28:28
...
这篇文章主要介绍了html无序列表标签和有序列表标签使用示例,需要的朋友可以参考下
一、上下层列表标签:<dl>..</dl>:
上层dt
下层dd:封装的内容会被自动缩进的效果
代码如下:
<dl> <dt>运动户外</dt> <dd>板鞋</dd> <dd>篮球鞋</dd> <dd>足球鞋</dd> <dd>跑步鞋</dd> </dl>
二、定义有序列表: <ol>
属性:
type: 可以设置排序的样式 (也可以给li单独加这个属性)
1表示以 1,2,3,4 来表示
a 表示以 a,b,c,d 来表示
A 表示以 A,B,C,D 来表示
i 表示以 i,ii ,iii 来表示
I 表示以 I,II,III来表示
start:列表起点
<li>:列表内容
代码如下:
<ol type="a" start="55"> <li>板鞋</li> <li>篮球鞋</li> <li>跑步鞋</li> <li>足球鞋</li> </ol>
三、定义无序列表:<ul>
属性:type:可以设置排序的样式 也可以给li单独加这个属性
dise 实心圆(默认值)
circle 空心圆
square 实心方块
<li>:列表内容
代码如下:
<ul type="square"> <li type="disc">板鞋</li> <li>篮球鞋</li> <li>跑步鞋</li> <li>足球鞋</li> </ul>
更多html无序列表标签和有序列表标签使用实例详解相关文章请关注PHP中文网!
推荐阅读
-
html无序列表标签和有序列表标签使用示例_HTML/Xhtml_网页制作
-
什么是无序列表、有序列表 、定义列表?html列表标签学习笔记
-
html列表使用方法?html有序列表无序列表详解
-
html无序列表标签和有序列表标签使用示例_HTML/Xhtml_网页制作
-
HTML中ul标签如何去掉点?HTML无序列表的样式实例解析
-
图文详解HTML中有序列表、无序列表和自定义列表的区别
-
<学习html>第四天笔记-注释标签;相对路径,绝对路径;有序列表,无序列表,自定义列表;总结
-
【前端学习笔记day11】2.7. html列表标签+html列表 +有序列表+ 无序列表 +定义列表
-
html无序列表标签和有序列表标签使用实例详解
-
html列表使用方法?html有序列表无序列表详解