HTML5学习-列表标签

列表标签

1，背景：如果说表格是用来显示数据的，那么列表就是用来布局的
2，特点：列表最大的特点就是整齐，整洁，有序，他作为布局会更加自由和方便
3，分类：无序列表，有序列表和自定义列表

      A,无序列表（掌握）
           1)，<ul>标签标示HTML页面中项目的无序列表，一般会以项目符号呈现列表项，而列表使用<li>标签定义
           2)，格式
           <ul>
               <li>列表项1</li>
               <li>列表项1</li>
               <li>列表项1</li>
                  ...
            <ul>

               3) 注意：
                        无序列表的各个列表之间没有顺序级别之分，是并列的
                        
里面只能放
 ,直接放在
标签中输入其他标签或文字是不被允许的
里面可以容纳所有的元素
                        无序列表会带有自己的样式属性，但在实际使用时，我们会使用CSS来设置
                        
          B,有序列表（理解）
                     1)，有序列表即为有排序顺序的列表，其中各个列表会按照一定的顺序排列
                     2)， 在HTML标签中，
标签用于定义有序列表，列表顺序以数字来显示，并且
标签来定义列表项
                     3)，格式：
                             

                                    
列表1
                                    
列表1
                                    
列表1
                              
                     4)， 注意事项：
                                
里面只能放
 ,直接放在
标签中输入其他标签或文字是不被允许的
                                
里面可以容纳所有的元素
                                无序列表会带有自己的样式属性，但在实际使用时，我们会使用CSS来设置
            C，自定义列表
                       1)，使用背景：常用于对术语或名词进行解释和描述，定义列表项前没有任何符号
                       2)，语法格式：
                                      

                                                 
名词1
                                                 
名词1解释1
                                                 
名词1解释2
                                      
                         3)，注意：
                                       
里面只能包含
和

                                       
和
个数没有限制，经常是一个
对应多个
.
                                       
和
是并列关系
                                       在HTML标签中，
标签用于定义描述列表（或定义列表），该列表会与
（定义项目/名字）和
（描述每一个项目/名字）一起使用。
                         4)，实例：
                                        
 
                                               
关注我们
                                               
方式一
        
                                               
方式二
        
                                               
方式三
       
                                                
了解更多
        
                                                
方式一
        
                                                
方式二
        
                                                
方式三