如何在 html ul li 标签中缩进
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9182482/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make indentation in html ul li tag
提问by bragboy
I have unordered list which has bulleted text within. I need to indent the list items in line. However for long running text, the style is not working as expected. I should make it aligned within the border box. Here is the css code
我有无序列表，其中包含项目符号文本。我需要在行中缩进列表项。但是，对于长时间运行的文本，样式无法按预期工作。我应该让它在边框框内对齐。这是css代码
ul{
background-color: #FFFFFF;
border: 1px solid black;
border-radius: 3px 3px 3px 3px;
list-style: disc inside none;
padding: 10px;
}
Here is the example HTML
这是示例 HTML
<div style="padding:20px">
<ul>
<li>Should be minimum of 8 characters</li>
<li>A long running text A long running text A long running text A long running text A long running text</li>
<li>Should have at least one number</li>
</ul>
</div>
JS Fiddle link : http://jsfiddle.net/jHJXq/
JS小提琴链接：http: //jsfiddle.net/jHJXq/
回答by IMI
Is this what you are looking for? http://jsfiddle.net/jHJXq/3/
这是你想要的？ http://jsfiddle.net/jHJXq/3/
ul{
background-color: #FFFFFF;
border: 1px solid black;
border-radius: 3px 3px 3px 3px;
list-style: disc outside none;
padding: 10px 10px 10px 25px;
}
I changed the list style to "outside" and gave some extra padding to the left.
我将列表样式更改为“外部”，并在左侧添加了一些额外的填充。
回答by Diodeus - James MacFarlane
Add style to the LI:
将样式添加到LI：
li {
margin-left:15px;
}
回答by Vitor Freitas
change the list-style from inside to outside
将列表样式从内到外更改
list-style: disc outside none;
回答by Stig Hausberg
ul{
background-color: #FFFFFF;
border: 1px solid black;
border-radius: 3px 3px 3px 3px;
list-style: disc;
padding:10px;
}
li{
margin-left:10px;
}
