zoukankan      html  css  js  c++  java
  • CSS list-style属性控制ul标签样式

    试一试

    <style type="text/css" media="all">
                ul 
                { 
                    list-style-type: disc;
                }
            
                ul#circle
                { 
                    list-style-type: circle;
                }
            
                ul#square
                { 
                    list-style-type: square;
                }
            
                ul#decimal
                { 
                    list-style-type: decimal;
                }
            
                ul#decimal-leading-zero
                { 
                    list-style-type: decimal-leading-zero;
                }
            
                ul#lower-roman
                { 
                    list-style-type: lower-roman;
                }
            
                ul#upper-roman
                { 
                    list-style-type: upper-roman;
                }
            
                ul#lower-greek
                { 
                    list-style-type: lower-greek;
                }
            
                ul#lower-latin
                { 
                    list-style-type: lower-latin;
                }
            
                ul#upper-latin
                { 
                     
                }
            
                ul#armenian
                { 
                    list-style-type: armenian;
                }
            
                ul#georgian
                { 
                    list-style-type: georgian;
                }
            
                ul#lower-alpha
                { 
                    list-style-type: lower-alpha;
                }
            
                ul#upper-alpha
                { 
                    list-style-type: upper-alpha;
                }
            
                ul#none
                { 
                    list-style-type: none;
                }
                ol 
                { 
                    list-style-type: lower-roman;
                }
            </style>
    <body>
            <ul>
                <li>正常模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
            
            <ul id="circle">
                <li>圆圈模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
             
            
            <ul id="square">
                <li>正方形模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
             
            <ul id="decimal">
                <li>数字模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
            
            <ul id="decimal-leading-zero">
                <li>以一个0开头的数字模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
             
            
            <ul id="lower-roman">
                <li>小写罗马文字模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
             
            <ul id="upper-roman">
                <li>大写罗马文字模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
            
            <ul id="lower-greek">
                <li>小写阿拉伯文字模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
             
            
            <ul id="lower-latin">
                <li>小写拉丁文模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
             
            <ul id="upper-latin">
                <li>大写拉丁文模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
             
            
            <ul id="armenian">
                <li>亚美尼亚数字模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
             
            
            <ul id="georgian">
                <li>乔治亚数字模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
             
            <ul id="lower-alpha">
                <li>小写拉丁文模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
            
            <ul id="upper-alpha">
                <li>大写拉丁文模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
             
            
            <ul id="none">
                <li>无模式</li>
                <li>草莓</li>
                <li>香蕉</li>
                <li>苹果</li>
            </ul>
    
        </body>
  • 相关阅读:
    案例------存储过程
    案例------冒泡排序
    案例------递归调用
    天气预报接口api(中国天气网)
    【转】ubuntu64,ndk-r9 编译 ffmpeg 2.1.1的config文件
    android权限大全
    JNI 回调小记
    java设置环境变量小工具
    bootstrap之双日历时间段选择控件—daterangepicker(汉化版)
    一个 bootstrap 弹出框插件
  • 原文地址:https://www.cnblogs.com/yingzi1028/p/5663659.html
Copyright © 2011-2022 走看看