CSS 基础学习-108 css使用list-style-position 属性指定列表项标记位置

由 hrs, 17 十月, 2021

list-style-position 属性指定列表项标记位置

实例代码：

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <style>
      p{
        color:red;
      }
    li{
        font-size:20px;
      }
      ul{
        list-style-image:url('img/aa.gif');
      }
    </style>
  </head>
  <body>
    <h1>list-style-position 属性列表标记位置</h1>
    <h2>list-style-position:outside(默认)</h2>
    <ol>
      <li>coffee</li>
      <li>tea</li>
      <li>Coca cola</li>
    </ol>

    <h2>list-style-position:inside</h2>
    <ul>
      <li>coffee</li>
      <li>tea</li>
      <li>Coca cola</li>
    </ul>
    <p>注：outside 列表标记在外，inside列表标记在内。</p>
  </body>
</html>

运行效果：

css-108.png

标签

评论