首页 > 文章 > web前端 > css中列表样式是什么

css中列表样式是什么

coldplay.xixi原创: 2021-03-21 17:56:253361浏览

css中列表样式是：1、css有序列表【ol】和css无序列表【ul】；2、css列表标号样式【list-style-type】；3、css标号样式的显示方式【list-style-position】。

css中列表样式是什么

本教程操作环境：windows7系统、css3版，DELL G3电脑。

css中列表样式是：

1、css有序列表(ol)和css无序列表（ul）

　　list.html
 
　　<!doctypehtml><html><head>
 
　　<metacharset="utf-8">
 
　　<title>列表样式</title>
 
　　<linkhref="box.css"type="text/css"rel="stylesheet"></head><body>
 
　　<p>
 
　　<ul>
 
　　<li>水果<ol>
 
　　<li>苹果</li>
 
　　<li>香蕉</li>
 
　　<li>梨子</li>
 
　　</ol>
 
　　</li>
 
　　</ul>
 
　　</p></body></html>

2、css列表标号样式list-style-type

　　属性值：

　　circle;空心圆
　　disc;实心圆
　　decimal;数字

　　list.css
 
　　ul>li{
 
　　list-style-type:circle;
 
　　}
 
　　ul>li>ol>li{
 
　　list-style-type:disc;
 
　　}

3、css标号样式的显示方式list-style-position

　　属性值：outside(在文本之外,默认)

　　inside(和文本一起)

　　list.css
 
　　ul{
 
　　text-align:center;
 
　　list-style-position:outside;
 
　　}
 
　　ul>li{
 
　　list-style-type:circle;
 
　　}
 
　　ul>li>ol>li{
 
　　list-style-type:disc;
 
　　}

相关教程推荐：CSS视频教程

以上是css中列表样式是什么的详细内容。更多信息请关注PHP中文网其他相关文章！

css css3 position ul

声明：

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

上一篇：css有哪几类样式下一篇：css中怎么插入表格

查看更多