HTML CSS列表样式更改

Question

我想在代码中使用清单以获得以下输出-

[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如何调整线条？

Answer 1

根据您的要求进行了更新：

 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> 

Answer 2

试试这个CSS jsfiddle

ol { list-style: none; 
counter-reset:array;}
ol li:before {
counter-increment:array;
content:"[" counter(array) "] ";
}