码迷,mamicode.com
首页 > 其他好文 > 详细

无序列表、有序列表、定义列表多样选择设置属性值

时间:2019-01-03 22:42:03      阅读:234      评论:0      收藏:0      [点我收藏+]

标签:title   ast   --   除了   http   nbsp   dev   选择   lang   

<!DOCTYPE html>

    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
        /*内联样式*/
        <style>
            li {
                /* //去掉前面的符号 */
                list-style: none;
                /* //给列表前面添加罗马数字 */
                list-style: lower-roman;
    
            }
    
            /* //选择列表中的第四项 */
    
            li:nth-child(4) {
                background-color: red;
            }
    
            /* //选择列表中的最后一项 */
    
            li:last-child {
                background-color: red;
            }
    
            /* //选择列表的奇数 */
    
            li:nth-child(odd) {
                background-color: red;
            }
    
            /* //选择列表中的双数 */
    
            li:nth-child(even) {
                background-color: orange;
            }
    
            /* //选择中间间隔两个列表 */
    
            li:nth-child(3n+1) {
                background-color: red;
            }
    
            /* //除了最后一个其他的全部选择 */
    
            li:not(:last-child) {
                background-color: red;
            }
    
            /* //选择列表的前三个列表 */
    
            li:nth-child(-n+3) {
                background-color: red;
            }
    
            /* //选择列表的第三个 */
    
            li:nth-child(3)>a {
                background: red;
            }
        </style>
    
    </head>
    
    <body>
        <!-- 无序列表: -->
        <ul>
            <li></li>
            <li></li>
        </ul>
        <!-- 有序列表: -->
        <ol>
            <li></li>
            <li></li>
        </ol>
        <!-- 定义列表: -->
        <dl>
            <dt>
                <dd></dd>
                <dd></dd>
            </dt>
        </dl>
    </body>
    
    </html>

无序列表、有序列表、定义列表多样选择设置属性值

标签:title   ast   --   除了   http   nbsp   dev   选择   lang   

原文地址:https://www.cnblogs.com/tian-520/p/TianYong1.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!