admin管理员组文章数量:1794759
酷狗列表页的html代码,html
今天,我要实现的列表是这样的:
目标列表
列表实现的源代码参见github
完成这个列表我们来拆分一下任务吧,这个列表从外向里可划分为3层。
1.实现最外层的无序列表,代码是这样的:
- JavaScript
- Java
结果长成这样:
第一步结果图
2.实现中间层的有序列表,代码是这样的:
- JavaScript
- 第一章
- 第二章
- Java
- 第一章
- 第二章
第二步实现结果图:
第二步结果图
3.实现第三层的无序列表,代码长这样(这里是部分代码哦,在第二步的基础上增加):
JavaScript- 第一章
- const
- let
- 第二章
- function
- object
第三步的实现的结果是这样的:
第三步结果
好了,就这样三步这个简单的列表就完成了
小知识:
实现下面这样的无序列表在ul标签中加type="disc"或省略type不写
黑点无序列表
实现这样的无序列表在ul标签中加type="circle"
圆圈无序列表
实现这样的无序列表在ul标签中加type="square"
方块无序列表
本文标签: 酷狗列表页的html代码html
版权声明:本文标题:酷狗列表页的html代码,html 内容由林淑君副主任自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.xiehuijuan.com/baike/1693688306a277333.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论