CSS架构

列表

元素:

有序列表;
ol元素表示有序列表项,li元素表示条目
start只能是数字,
以type属性名和值(1,a,A,I,i)来表示有序列表

<body>
<!--以type属性表示有序列表符号类型
    1 A a I i
    start属性,只能用数字,表示有序符号的开始位置
  -->
<ol start="4" type="I">
    <!--<li>表示列表项
        以type属性表示有序列表符号类型
    1 A a I i
    value属性,只能用数字,表示列表项的值符号的开始位置-->
    <li>PC端</li>
    <li value="6" type="i">网游</li>
    <li>页游</li>
    <li>手游</li>
</ol>
</body>

无序列表;

ul元素表示无序列表项,li元素表示条目
以type属性名和值(1,a,A,I,i)来表示无序列表

<body>
<!--type属性表示无序列表的符号类型
      circle表示空心圆
      disc默认值,表示实心圆
      square表示实心方形
    -->
<ul type="square">
    <li>PC端</li>
    <!--<li>表示无序列表的列表项
      -->
    <li>网游</li>
    <li>手游</li>
    <li>页游</li>
</ul>
</body>

嵌套列表;

在li元素在放另一个有序或无序列表

<body>
<ul>
    <li>PC端</li>
    <li>网游
        <ul>
            <li>3D网游</li>
            <li>2D网游</li>
        </ul>
    </li>
    <li>手游</li>
    <li>页游</li>
</ul>
<ol>
    <li>PC端</li>
    <li>网游
        <ol>
            <li>3D网游</li>
            <li>2D网游</li>
        </ol>
    </li>
    <li>手游</li>
    <li>页游</li>
</ol>
</body>

定义列表;

 <style>
        dd::before{
            conent:'-';
        }
    </style>
</head>
<body>
<dl>
    <!--<dl>元素定义列表-->
    <!-- <dt>元素 - 表示(列表的分类标题) -->
    <dt>游戏</dt>
    <!-- <dd>元素 - 表示定义列表中的列表项 -->
    <dd>PC端</dd>
    <dd>网游</dd>
    <dd>手游</dd>
</dl>
</body>

佐珥玎
41 声望8 粉丝