如何使用 CSS 指示标记应该出现在包含项目符号的框内还是框外?
list-style-position 属性指示标记应该出现在包含项目符号的框内还是框外。它可以具有以下两个值之一
值 | 描述 |
---|---|
none | 不适用 |
inside | 如果文本换行到第二行,则文本将在标记下方换行。它也将缩进到如果列表的值为 outside,文本将开始的位置。 |
outside | 如果文本换行到第二行,则文本将与第一行的开头对齐(在项目符号的右侧)。 |
示例
您可以尝试运行以下代码以实现 list-style-position 属性
<html> <head> </head> <body> <ul style = "list-style-type:circle; list-style-position:outside;"> <li>BMW</li> <li>Audi</li> </ul> <ul style = "list-style-type:square;list-style-position:inside;"> <li>BMW</li> <li>Audi</li> </ul> <ol style = "list-style-type:decimal;list-style-position:outside;"> <li>BMW</li> <li>Audi</li> </ol> <ol style = "list-style-type:lower-alpha;list-style-position:inside;"> <li>BMW</li> <li>Audi</li> </ol> </body> </html>
广告