有序列表和无序列表、定义列表 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            /*
              去掉项目符号
            */
           /* ul{
               list-style: none;
           } */
        </style>
    </head>
    <body>
        <!-- 
            三种列表
              - 无序列表
              - 有序列表
              - 定义列表
         -->
         
         <!-- 
             无序列表
                 - ul标签创建
                 - 使用li在列表中创建项
                 
             通过type属性可以修改列表的项目符号
                  值 disc 默认值
                     square 实心方块
                     circle 空心圈
             注意：默认项目符号我们一般不使用
                  若需要设置项目符号可采用为例设置背景图片方式设置
          -->
          <ul>
              <li>西门庆</li>
              <li>潘金莲</li>
              <li>武大郎</li>
          </ul>
          
          <!-- 
              有序列表和无序类似 用ol代替ul
              使用有序符号作为项目符号
              type属性可以指定序号的类型
                  值 - 默认 阿拉伯数字
                     - a/A 英文字母
                     - I/i   罗马数字
              ol也是块元素
           -->
           <ol>
               <li>西门庆</li>
               <li>武大郎</li>
               <li>潘金莲</li>
           </ol>
           
           <!-- 
               列表之间可以互相嵌套，在无序中方有序，有序中放无序
            
            -->
           <p>菜谱</p>
           <ul>
               <li>
                鱼肉
                <ol>
                    <li>鱼</li>
                    <li>肉丝</li>
                </ol>
            </li>
               <li>鸡丁</li>
               <li>肉丝</li>
           </ul>
           
    </body>
</html>

 

 

 

无序列表

    <ul>

   <li></li>

    </ul>

有序列表

　

    <ol>

   <li></li>

    </ol>

 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <!-- 
            定义列表用来对一些词汇或内容进行定义 
            dl 来创建一个定义列表 
                dl中有两个子标签
                        dt 被定义的内容
                        dd 对定义内容的描述
            同样dl和ul和ol之间都可以相互嵌套
         -->
         <dl>
             <dt>潘金莲</dt>
             <dd>下毒整死武大郎</dd>
             <dd>下毒整死武大郎</dd>
         </dl>
         
    </body>
</html>

 

定义列表 

   dl创建定义列表

     dl中有两个子标签

  　　　　dt 被定义的内容

　　　　  dd 对定义内容的描述

dl ul ol 之间可以相互嵌套

 

posted @ 2021-06-30 19:07  2237774566  阅读(442)  评论(0)    收藏  举报