在HTML中,有序列表(ol)和无序列表(ul)元素通常会默认有一定的内边距(padding)和外边距(margin),这是由浏览器默认样式表所定义的。这些内边距和外边距可能导致列表向左偏移,从而出现左边超出的情况。
具体来说,ol和ul元素的默认样式表通常会定义:
padding-left:列表项左侧的内边距,默认为40px(不同浏览器可能略有不同)。margin-left:列表元素左侧的外边距,默认为0。
因此,当你在HTML中使用ol或ul元素时,它们的左边可能会默认超出。
解决
/* 去掉有序列表和无序列表的默认样式 */ ol, ul { margin: 0; padding: 0; list-style-type: none; } /* 为有序列表添加数字编号 */ ol { list-style-type: decimal; margin-left: 20px; } /* 为无序列表添加实心圆点符号 */ ul { list-style-type: disc; margin-left: 20px; }