如何使用创建项目符号<li>元素？

我们知道，无论是有序列表还是无序列表，它们都带有编号。

它可能是：

• 子弹
• 正方形
• 十进制
• 罗曼等。

我们可以使用许多选项，但问题是这取决于什么属性？

在 CSS 中，对于像

和
这样的标签，有一个名为list-style-type 的属性。

方法： list-style-type属性决定了项目符号、正方形或小数等是否带有 li 元素。要更改或了解它对 HTML 的影响，可以使用针对选择器

或
的 CSS。

语法： CSS 定位

1. 元素：

   ol {
       list-style-type: decimal
   }
   ul {
       list-style-type: disc
   }    
   

   让我们通过例子来理解：

   1. 有序列表的默认列表样式类型是十进制，无序是光盘。从上面的代码可以看出。
      • 例子：

        
        
        
          
          
          
        
        
          
        Ordered List:
          
        
              
        Eggs
              
        Bacon
              
        Leeks
          
          
        Unordered List:
          
        
              
        Coriander
              
        Basil
              
        Onion
          
        
        
        

      • 输出：
        

        在默认样式中，

        标签带有 Decimal，
        带有 Disc/Bullets，如上面 CSS 中定义的那样。

        从这里我们了解子弹是如何进入

        • 元素的，但我们也可以将它们更改为其他内容。

        1. 现在我们知道项目符号在列表元素中的位置，我们可以相应地更改它。让我们将其设置为有序列表中的罗马数字和无序列表中的方格。
           • 例子：

             
             
             
               
               
               
               
               
             
               
             
               
             Ordered List:
               
             
                   
             Eggs
                   
             Bacon
                   
             Leeks
               
               
             Unordered List:
               
             
                   
             Coriander
                   
             Basil
                   
             Onion
               
             
             
             

           • 输出：
             

             在这里我们可以清楚地看到子弹/圆盘被正方形和小数替换为罗马数字。

        完整代码：

        
        
        
          
          
          
        
          
        
          
        Ordered List:
          
        
              
        Eggs
              
        Bacon
              
        Leeks
          
          
        Unordered List:
          
        
              
        Coriander
              
        Basil
              
        Onion
          
          
        Ordered List:
          
        
            
        Eggs
            
        Bacon
            
        Leeks
          
          
        Unordered List:
          
        
            
        Coriander
            
        Basil
            
        Onion
          
        
                            
        

        输出：

        

        使用默认和自定义内联 CSS

        同样，我们可以将 list-style-type 更改为多种类型：

        1. 上阿尔法
        2. 低阿尔法
        3. 没有任何
        4. 圆圈

           还有很多…。