JZe*_*ig1 11 html css alignment html-lists
这可能看起来像一个愚蠢的问题,但我已经在基本页面中添加了UL,并且列表似乎偏离了中心.列表没有什么特别之处.没有添加特定的CSS:只是一个列表.当我装载它时,它略微偏离中心.
左侧是否有默认边距或填充?
<h3>Title Heading</h3>
<ul id="listItems">
<li>itemOne</li>
<li>itemTwo</li>
<li>itemThree</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
主体具有用于居中,对齐,浮动等的所有css代码."标题标题"完美对齐.只是列表有点偏.
谢谢.
哦,不知道这是否重要,但我添加了'id'原因...想要使用'first-of-type'给第一项em(粗体).
Mic*_*son 13
问题是,默认情况下,浏览器具有自定义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;
}
Run Code Online (Sandbox Code Playgroud)
您必须为自己使用自定义规则ul
:
element.style {
margin-left: 0px;
/* set to 0 if your not using a list-style-type */
padding-left: 20px;
}
Run Code Online (Sandbox Code Playgroud)
列表将始终对齐,因此文本与父元素的边缘保持一致。这意味着默认情况下,项目符号将位于元素的外部(左侧)。您可以强制对齐发生在项目符号上,而不是像这样的文本:
ul {
list-style-position: inside; }
Run Code Online (Sandbox Code Playgroud)
或者,您可以添加自己的边距来推送整个列表元素,如下所示:
ul {
margin-left: 20px; }
Run Code Online (Sandbox Code Playgroud)
归档时间: |
|
查看次数: |
21110 次 |
最近记录: |