首页 >web前端 >html教程 >html列表快速预览

html列表快速预览

无忌哥哥
无忌哥哥原创
2018-06-29 10:08:352000浏览

列表是一种非常有用的数据展现方式,可以扩展出非常多的有意思的功能,例如导航,布局等。

列表主要有三种:

1. 无序列表: ff6d136ddc5fdfeffaf53ff6ee95f185标签,必须与25edfb22a4f469ecb59f1190150159c6子标签配对使用

2. 有序列表: c34106e0b4e09414b63b2ea253ff83d6标签,与ff6d136ddc5fdfeffaf53ff6ee95f185使用规则一样,可以看作是无序列表的一个特例,实际开发中使用不多

3. 自定义列表: 5c69336ffbc20d23018e48b396cdd57a73de882deff7a050a357292d0a1fca9467bc4f89d416b0b8236eaa5f43dee742非常像名词解释,用途非常广泛,例如底部导航,内容详情页,联系信息,商品描述等.

ul有一个属性type,可以设置列表项前面的标记 

type="disc" 实心小黑点,这是默认一级列表的标记

type="circle" 空心小圆点,这是二级列表默认标记

type="square" 实心方块

<html>
<head>
<meta charset="UTF-8">
<title>1-1.列表快速预览</title>
</head>
<body>
<ul type="square">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
<li>jQuery</li>
<li>Bootstrap</li>
</ul>
<hr>
<h4>单身狗的周未</h4>
<ol>
<li>自己请自己看场电影希望有艳遇</li>
<li>购买充气娃娃2个</li>
<!-- 列表是可以嵌套的 -->
<ul>
<li>冰冰款2个</li>
<li>凤姐款1个</li>
</ul>
<li>玩"吃鸡"</li>
<li>为心目中的女主播打Call</li>
</ol>
<hr>
<h4>后端编程语言:</h4>
<dl>
<dt>PHP</dt>
<dd>超文本预处理编程语言</dd>
<dt>MySQL</dt>
<dd>全球最流行的关系型数据库管理工具</dd>
<dt>ThinkPHP5.1</dt>
<dd>国内最流行的中文轻量级PHP开发框架</dd>
</dl>
</body>
</html>

以上是html列表快速预览的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn