如何在html ul li标签中进行缩进

发布时间：2020-12-14 23:43:32 所属栏目：资源来源：网络整理

导读：我有无序列表,里面有项目符号.我需要缩进列表项目.但是对于长时间运行的文本,样式不能按预期工作.我应该在边框内对齐它.这是css代码 ul{ background-color: #FFFFFF; border: 1px solid black; border-radius: 3px 3px 3px 3px; list-style: disc inside non

我有无序列表,里面有项目符号.我需要缩进列表项目.但是对于长时间运行的文本,样式不能按预期工作.我应该在边框内对齐它.这是css代码

ul{
    background-color: #FFFFFF;
    border: 1px solid black;
    border-radius: 3px 3px 3px 3px;
    list-style: disc inside none;
    padding: 10px;
}

这是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小提琴链接：http://jsfiddle.net/jHJXq/

解决方法

这是你想要的？
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;
}

我将列表样式更改为“outside”,并在左侧添加了一些额外的填充.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!