代码实例
<!DOCTYPE HTML>
<html>
<head>
<style>
li.inside {
list-style-position: inside;
}
li.outside {
list-style-position: outside;
}
li {
background-color: lightgray;
}
</style>
</head>
<body>
<ul>
These are the inside items:
<li class="inside">A</li>
<li class="inside">B</li>
<li class="inside">C</li>
These are the outside items:
<li class="outside">D</li>
<li class="outside">E</li>
<li class="outside">F</li>
</ul>
</body>
</html> 尝试一下 »
点击“尝试一下”按钮查看在线实例
您可以使用list-style-position属性指定标记相对于li元素的内容框的位置。
允许的值在内部（标记在内容框内）和外部（标记在内容框外部）。
以下代码显示了list-style-position属性及其使用的值。
<!DOCTYPE HTML>
<html>
<head>
<style>
li.inside {
list-style-position: inside;
}
li.outside {
list-style-position: outside;
}
li {
background-color: lightgray;
}
</style>
</head>
<body>
<ul>
These are the inside items:
<li class="inside">A</li>
<li class="inside">B</li>
<li class="inside">C</li>
These are the outside items:
<li class="outside">D</li>
<li class="outside">E</li>
<li class="outside">F</li>
</ul>
</body>
</html>