当前第2页 返回上一页
使用list-style-position属性的示例如下：
1 2 3 4 5 6 7 8 9 | li{
list-style-type:square;
list-style-position:outside;
}
<ul>
<li>这里是使用list-style-position属性值为outside的示例。请注意换行以后项目符号的位置。</li>
<li>这里是列表内容</li>
<li>这里是列表内容</li>
</ul>
|
再来看一下属性值为inside的样式。
1 2 3 4 5 6 7 8 9 | li{
list-style-type:square;
list-style-position:inside;
}
<ul>
<li>这里是使用list-style-position属性值为inside的示例。请注意换行以后项目符号的位置。</li>
<li>这里是列表内容</li>
<li>这里是列表内容</li>
</ul>
|
四、list-style属性
list-style属性是综合设置li样式的属性，也是一个可以继承的属性，语法结构如下：
1 | li-style:list-style-type/list-style-image/list-style-position
|
各个值的位置可以交换。比如：
1 2 3 4 5 6 7 | li{
list-style:url(images/bg03.gif) inside;
}
<ul>
<li>这里是使用list-style属性的示例。请注意换行以后项目符号的位置。</li>
<li>这里是列表内容</li>
</ul>
|
以上就是css如何设置li的样式的详细内容，更多文章请关注木庄网络博客！
返回前面的内容
相关阅读 >>
css hanging-punctuation属性怎么用
css border-right-style属性怎么用
chrome css加载不出来怎么办
怎么用css实现左右运动效果
css如何解决高度不一致问题
10款好看且实用的文字动画特效，让你的页面更吸引人！
css有超文本标记选择器吗
css实现自适应宽度的菜单（代码实例）
css怎么让两个div在同一行显示
html+css+javascript如何实现列表循环滚动
更多相关阅读请进入《css》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者
转载请注明出处：木庄网络博客 » css如何设置li的样式
