1. 字体排印
  2. list-style-position

字体排印

list-style-position

用于控制列表中项目符号和数字位置的实用工具。

样式
list-inside
list-style-position: inside;
list-outside
list-style-position: outside;

示例

基本示例

使用诸如 list-insidelist-outside 之类的实用工具来控制列表中标记和文本缩进的位置

list-inside

  • 5 杯切碎的牛肝菌
  • 1/2 杯橄榄油
  • 3 磅芹菜

list-outside

  • 5 杯切碎的牛肝菌
  • 1/2 杯橄榄油
  • 3 磅芹菜
<ul class="list-inside">  <li>5 cups chopped Porcini mushrooms</li>  <!-- ... --></ul><ul class="list-outside">  <li>5 cups chopped Porcini mushrooms</li>  <!-- ... --></ul>

响应式设计

前缀a list-style-position 实用工具 带有诸如 md: 之类的断点变体,以仅在中等 屏幕尺寸及以上应用该实用工具

<ul class="list-outside md:list-inside ...">  <!-- ... --></ul>

变体文档中了解有关使用变体的更多信息。

版权所有 © 2025 Tailwind Labs Inc.·商标政策