购物车
登陆 / 注册
微信扫码登陆

推荐手册

list-style-position

list-style-position
list-style-position属性指示如何相对于对象的内容绘制列表项标记。
前端控 前端控 更新时间:2019-03-22 14:00:54

CSS list-style-position属性


属性定义及使用说明

list-style-position属性指示如何相对于对象的内容绘制列表项标记。

运行实例

实例

<h2>Outside:</h2>
<ul style="list-style-position:outside;width:25%;">
<li style="border:1px solid #000000">Coffee</li>
<li style="border:1px solid #000000;border-top:0">Tea</li>
<li style="border:1px solid #000000;border-top:0">Coca-cola</li>
</ul>
<h2>Inside:</h2>
<ul style="list-style-position:inside;width:25%;">
<li style="border:1px solid #000000;">Coffee</li>
<li style="border:1px solid #000000;border-top:0;">Tea</li>
<li style="border:1px solid #000000;border-top:0;">Coca-cola</li>
</ul>
运行实例 »

点击 "运行实例" 按钮查看在线实例

默认值:outside
继承:yes
版本:CSS1
JavaScript 语法:object.style.listStylePosition="inside"



浏览器支持

表格中的数字表示支持该属性的第一个浏览器版本号。

属性
1.gif2.gif3.gif4.gif5.gif
list-style-position1.04.01.01.03.5

属性值

描述
inside列表项目标记放置在文本以内,且环绕文本根据标记对齐。
outside默认值。保持标记位于文本的左侧。列表项目标记放置在文本以外,且环绕文本不根据标记对齐。
inherit规定应该从父元素继承 list-style-position 属性的值。



规定列表中列表项目标记的位置:

实例

ul {
    list-style-position: inside;
}

运行实例 »

点击 "运行实例" 按钮查看在线实例

网站导航
标签地图
学习路径
视频教程
开发软件
旗下子站
php中文网
phpstudy
技术文章
文档工具
关于我们
企业合作
人才招聘
联系我们
讲师招募
QQ交流群
QQ官方交流群
微信公众号
微信公众号