UL 是否有默认的 margin 或 padding
Does UL have default margin or padding
这似乎是个愚蠢的问题,但我已将 UL 添加到基本页面,而且列表似乎偏离了中心。该列表没有什么特别之处。没有添加具体的 css:只是一个列表。当我加载实时时它稍微偏离中心。
左侧是否有默认边距或填充?
<h3>Title Heading</h3>
<ul id="listItems">
<li>itemOne</li>
<li>itemTwo</li>
<li>itemThree</li>
</ul>
主体有居中、对齐、浮动等所有css代码。
'Title Header' 完美对齐。只是列表有点偏差。
谢谢。
哦,不知道这是否重要,但我添加了 'id' 原因...想使用 'first-of-type' 给第一项 em(粗体)。
列表将始终对齐,因此文本与父元素的边缘保持一致。这意味着项目符号默认位于元素的外部(左侧)。您可以强制对齐项目符号点,而不是像这样的文本:
ul {
list-style-position: inside; }
或者,您也可以像这样添加自己的边距来推动整个列表元素:
ul {
margin-left: 20px; }
问题是默认情况下,浏览器有自定义 css - 在 chrome 例如:
ul, menu, dir {
display: block;
list-style-type: disc;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 40px;
}
您必须为 ul
:
使用自定义规则
element.style {
margin-left: 0px;
/* set to 0 if your not using a list-style-type */
padding-left: 20px;
}
这似乎是个愚蠢的问题,但我已将 UL 添加到基本页面,而且列表似乎偏离了中心。该列表没有什么特别之处。没有添加具体的 css:只是一个列表。当我加载实时时它稍微偏离中心。
左侧是否有默认边距或填充?
<h3>Title Heading</h3>
<ul id="listItems">
<li>itemOne</li>
<li>itemTwo</li>
<li>itemThree</li>
</ul>
主体有居中、对齐、浮动等所有css代码。 'Title Header' 完美对齐。只是列表有点偏差。
谢谢。
哦,不知道这是否重要,但我添加了 'id' 原因...想使用 'first-of-type' 给第一项 em(粗体)。
列表将始终对齐,因此文本与父元素的边缘保持一致。这意味着项目符号默认位于元素的外部(左侧)。您可以强制对齐项目符号点,而不是像这样的文本:
ul {
list-style-position: inside; }
或者,您也可以像这样添加自己的边距来推动整个列表元素:
ul {
margin-left: 20px; }
问题是默认情况下,浏览器有自定义 css - 在 chrome 例如:
ul, menu, dir {
display: block;
list-style-type: disc;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 40px;
}
您必须为 ul
:
element.style {
margin-left: 0px;
/* set to 0 if your not using a list-style-type */
padding-left: 20px;
}