这一次主要是学习HTML列表学习
效果先行(效果图太长，分了三张)：
代码：
注：type 和start除了无序列表无效，均有效
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>列表</title> </head> <body> <font size="3" color="#148923"> <h2>无序列表</h2> <b>ul是无序列表标记; li是列表项目标记; type可以规定列表前面的符号类型:disc,circle,square...</b> <ul type="disc"> <li>书</li> <li>音频</li> <li>视频</li> </ul> </font> <font face="黑体"size="3" color="#F34E9A"> <h2>有序列表</h2> <b>ol是有序列表标记； li是列表项目标记； type取值：l,a,A,i,I； start可规定开始 </b> <ol type="l" start="4"> <li>书</li> <li>音频</li> <li>视频</li> </ol> </font> <font face="隶书"size="3" color="#CEA237"> <h2>定义列表</h2> <b>dl是定义列表标记； dt是列表项目标记；其主要用于解释名词</b> <ol type="l" start="4"> <dt>*书</dt><dd>没啥好解释的</dd> <dt>*音频</dt><dd>喵</dd> <dt>*视频</dt><dd>video</dd> </ol> </font> <font face="楷体"size="3" color="#75356ED"> <h2>菜单列表标记</h2> <b>menu是菜单列表标记； li是列表项目标记； type取值：l,a,A,i,I； start可规定开始 </b> <menu type="A" start="1"><!--如果没有type和start，这个menu就和ul是一样的--> <li>《红楼梦》</li> <li>《西游记》</li> <li>《水浒传》</li> <li>《三国演义》</li> </menu> </font> <font face="华文行楷"size="3" color="#F35E1F"> <h2>目录列表标记</h2> <b>dir是目录列表标记； li是列表项目标记；通常用于一个压缩窄列的列表</b> <dir><!--如果没有type和start，这个dir就和ul是一样的--> <li>《红楼梦》</li> <li>《西游记》</li> <li>《水浒传》</li> <li>《三国演义》</li> </dir> </font> <font face="楷体"size="3" color="#75356ED"> <h2>菜单列表标记</h2> <b>menu是菜单列表标记； li是列表项目标记； type取值：l,a,A,i,I； start可规定开始 </b> <menu type="A" start="1"><!--如果没有type和start，这个menu就和ul是一样的--> <li>《红楼梦》</li> <li>《西游记》</li> <li>《水浒传》</li> <li>《三国演义》</li> </menu> </font> <font face="宋体"size="3" color="#FF0F43"> <h2>列表嵌套————定义列表的嵌套</h2> <b>一个dt多个dd</b> </br></br> <dt>《红楼梦》</dt> <dd>作者：曹雪芹</dd></br> <dd>人物：贾宝玉+林黛玉+薛宝钗+众多男男女女</dd> <dd>简介：还泪来，还泪去</dd> </font> <font face="华文幼圆" size="3" color="#5F43FA"> <h2>无序列表和有序列表的嵌套</h2> <ul type="square"><li>《魔戒》系列</li></ul> <ol type="1"> <li>魔戒1</li> <li>魔戒2</li> <li>魔戒3</li> </ol> <ul type="square"><li>《哈利·波特》系列</li></ul> <ol type="1"> <li>哈利·波特与魔法石</li> <li>哈利·波特与密室</li> </ol>          ... <ol type="1" start="7"> <li>哈利·波特与死亡圣器</li> </ol> </font> </body> </html>
HTML列表示例
时间： 2024-10-08 16:20:57