HTML CSS 列表样式更改

标签 html css

我想在我的代码中使用 list 来获得以下输出 -

[1]. This is my line one
[2]. This is my line two
[3]. this is my line three, which is very very long and is not justified when used under list. 

我使用了以下代码。但是没有用

<ol list-style-type: [decimal];>
<li>This is my line one</li>
<li>This is my line two</li>
<li>this is my line three, which is very very long and is not justified when used under list.</li>
</ol>

我是 html 和 css 编码的新手。! 我现在面临的问题是,当我使用这种风格时,长句在单个数字下是不合理的。这是它现在的样子:image.ibb.co/e8Nfda/image.png 如何证明我的台词正确?

最佳答案

已根据您的要求更新:

ol { list-style: none; 
    counter-reset:array;}
   ol li{text-indent: -2em;}
    ol li:before {
    counter-increment:array;
    content:"[" counter(array) "]. ";
    }
    <ol>
    <li>This is my line one This is my line one This is my line one This is my line one This is my line one This is my line one</li>
    <li>This is my line two</li>
    <li>this is my line three</li>
    </ol>

关于HTML CSS 列表样式更改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46014705/

相关文章:

java - 如何在jsp中从html文本区域行字符串java给出

css - 相当奇怪的 css/不透明度/悬停问题

html - 为什么我的页脚上的 CSS 边框将页面推到 100% 以上

javascript - 使用javascript使用多个按钮传入的唯一文本值填充两个单独的输入字段

当我使用 textarea 时,php 无法正确使用 textarea 标签并显示其余的 html 标签

php - Laravel 5 背景图像没有出现在 DOMPDF 上?

CSS 选择器的噩梦

javascript - 如何防止div文本溢出容器

jquery - 使用 LESS/CSS 将每个列表项的颜色更改 X%

javascript - innerHTML 不更新 DOM