第45篇 CSS属性选择器

1，内置函数复习    1.1 reduce

        #reduce 从可迭代对象里面不断的取值累加
        from functools import reduce
        li = [1,2,3,4,5,6]
        ret = reduce(lambda x,y:x+y,li)
        print(ret)

        res = reduce(lambda x,y:x+y,range(1,101))
        print(res)

1.2 sorted        1.2.1            按照年龄进行排序

li = [
            {‘name‘:‘gold‘,‘age‘:‘40‘},
            {‘name‘:‘eva-J‘,‘age‘:‘18‘},
            {‘name‘:‘naza‘,‘age‘:‘19‘},
            {‘name‘:‘gaoxin‘,‘age‘:‘20‘},
            {‘name‘:‘yuanju‘,‘age‘:‘50‘},
            ]

            li2 = sorted(li,key=lambda x:x[‘age‘],reverse=True)
            print(li2)

        1.2.2

#去重，并保持原来的次序
            li = [1,4,5,8,2,6,9,12,2,14,4,5,1,2,3]
            #方法一
            li2 = []
            for i in li :
                if i not in li2:
                    li2.append(i)
            print(li2)  # [1, 4, 5, 8, 2, 6, 9, 12, 14, 3]

            #方法二
            li_new = list(set(li))
            li_last = sorted(li_new,key=li.index)#按照li原来的顺序排序
            print(li_last)

1.3 zip方法得到是一个迭代器，里面的元素的数据类型是元组

        #采用dict强制转化成字典
        keys = [‘name‘,‘age‘,‘salary‘]
        values = [‘andy‘,18,50]
        d= dict(zip(keys,values))
        print(d)#{‘name‘: ‘andy‘, ‘age‘: 18, ‘salary‘: 50}

         #采用list强制转化成列表
        keys = [‘name‘,‘age‘,‘salary‘]
        values = [‘andy‘,18,50]
        ret = zip(keys,values)
        li = list(ret)
        print(li)#[(‘name‘, ‘andy‘), (‘age‘, 18), (‘salary‘, 50)]

#迭代器逐个取值的

        keys = [‘name‘,‘age‘,‘salary‘]
        values = [‘andy‘,18,50]
        ret = zip(keys,values)
        ret_iter = iter(ret)
        while 1:
            try:print(ret_iter.__next__())
            except StopIteration:
                break

2，正式进入CSS    1. 定义        HTML 超文本标记语言        CSS层叠样式表Cascading Style Sheets    2. 语法        标签选择器 {k1:v1,k2:v2}

3. CSS代码存放的位置        1. 直接写在标签中的style属性        2. 在head标签中的style标签内        3. 写在单独的SCC文本中，通过link标签引用

4. SCC选择器        如何在HTML代码中找到相应的标签        1. 基本选择器            1. ID标签选择器    -->#p1 {}            2. 标签选择器      -->div {}            3. 类选择器        -->.c1 {}            4. 通用选择器      -->* {}        2. 组合选择器            1. 子孙选择器（后代选择器）             -->div p {}            2. 儿子选择器（紧挨着父标签的子标签）    -->div>p {}            3. 毗邻选择器（紧挨着的下面的标签）      -->div+p {}            4. 弟弟选择器（同级下面的所有标签）      -->div~p {}                                                   -->div~* {}        3. 属性选择器            1. 有某个属性的标签                     -->div[title] {}            2. 有某个属性并且属性值等于给定的        -->div[title=‘hello‘] {}                                                   -->div[title^=‘hello‘] {}  以hello开始                                                   -->div[title$=‘hello‘] {}  以hello结束                                                   -->div[title*=‘hello‘] {}                                                   -->div[title~=‘hello‘] {}  按空格分割之后的列表中是否含有        4. 分组和嵌套            1. 分组应用于多个选择器找到标签应用相同的样式                div,p {}            2. 嵌套                 子孙 .c1 p {}                 儿子 .c1>p {}        5. 伪类选择器                    /*连接的默认样式*/                    a:link {color: red}

/*访问过的连接*/                    a:visited {color: yellow}

/*点击的一瞬间的样式*/                    a:active {color: #0000cc}

/*鼠标放上去之后的样式*/                    span:hover {color: deeppink}

/*文本框输入的样式*/                    input:focus {">伪元素选择器                    div.c1:first-letter {color: red;font-size: 48px}                    p:before {content: ‘*‘;color: #0000cc}                    p:after {content: ‘[?]‘;color: deeppink}    5. 选择器的优先级        1. 当选择器相同的时候            谁最后加载谁生效！！        2. 选择器不同的时候            1. 选择器优先级的权重：                内联样式（1000） > ID选择器（100） > class选择器（10） >元素选择器（1）            2. 不讲道理的！important

原文地址：https://www.cnblogs.com/cavalier-chen/p/9768103.html