CSS选择器

一.基本选择器

        1.标记选择器

                直接写标签名作为选择元素的依据

                tag{ }  span{ }  h1{ }......

        2.类别选择器

                 .class{ }直接使用类名作为选择元素的依据

        3.id选择器

                #id{        

                               直接使用id作为选择元素的依据

                     }

  

        1.交集选择器

由一个标签后面紧跟类别或id,必须满足两种条件才会被选中

                标签名字和类名,id 一起选中。

                tagname.class{ }

                tagname#id{}

        2.并集选择器

                由一个或多个基本或复合选择器用逗号隔开,只要符合其中任意一个,就会被选中

                sel1,sel2,sel3{}

                

        3.后代选择器

         sel1 sel2 sel3{
                    根据左祖右后代的原则,用空格隔开,
                    可以精准的获取特定的子辈元素

                        只会选中最后那个孩子,sel3.
                }

        4.子辈选择器

         sel1>sel2{

            只能获取子元素,不能获取孙元素

        }

        5.紧邻兄弟选择器

                

sel1 + sel2{ }

就是和sel1相邻的标签为sel2的兄弟元素

        以下三个条件缺一不可

        1.向下选取

        2.两个元素相邻

        3.互为兄弟

        6.兄弟选择器

sel1 ~ sel2{}
            以下两个条件缺一不可
            1.向下选取 
            2.互为兄弟

            不紧邻也会选中。

        7.全选选择器

             *{ }
                相当于ctrl +a 选中所有标签

        8.伪类选择器   

                 sel1:伪类{

                                }

a:visited{
            color:coral;
        }

a:hover{
            color:cornflowerblue;
            /* 字体倾斜 */
            font-style: italic;
        }

           a:visited 表示链接被访问之后的样式  链接限定
            a:hover 表示元素鼠标滑过时的样式,任意元素可用 
       

引入方式的优先级,在基本选择器内

         !important  > 行内式 >  id > 类别 > 标记  

  • 24
    点赞
  • 20
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值