首先，来看一个简单，单独的列表项目。该列表项目没有标记符号（或称之为“着重号”），并且没有被列表包裹起来。如下图图 1 所示，单独的列表项是无效的，简单且没有任何装饰。

红色的虚线边框代表列表项目内容区域的外边界。记住，从这一点上看，这个列表项目没有内边距和边框。如果我们再添加两个列表项目，我们得到下面的结果，如图 2 所示。

现在我们在外面加上父元素；这个例子中，我们使用一个无序列表 (i.e., )。根据 CSS 盒子模型，列表项目的盒子必须显示在其父元素的内容区域里。因为这里的父元素既没有 padding 也没有 margin，所以我们得到下面的结果，如图 3 所示。

这里，蓝色的虚线边框表示 元素内容区域的边缘。因为我们没有给 元素添加内边距，所以它的内容的包裹层紧贴在三个列表项外。

现在我们来添加列表项目标记，由于这是一个无序列表，我们添加传统的实心圆“着重标记”，如下图图 4 所示。

可以看到，这些标记符号在内容区域的外面，但这无关紧要。重要的是，这些标记被放到主要的元素盒子外面了。它们有点像列表项目的附件，在的内容区域外游荡，但依然依附于。

这就是为什么在除了 IE 浏览器以外的所有浏览器上，标记符号都被放在元素的边框外，假设列表项位置的值为外部"outside"。如果该值被改为内部"inside"，则标记符号会被放到的内容区域里面，像是放在最开头的内联盒子一样。