CSS复合选择器

1 后代选择器

可以选择父元素里面的任何后代元素, 元素之间用空格隔开
        语法:

/*父元素 后代元素 { 样式声明 }*/
ul li {
    color: red;
}
ul li a {
    color: blue;
}2 子选择器

子选择器只能选择父元素的最近一级子元素,不考虑孙子元素。可以理解为亲儿子选择器。元素之间用‘>’隔开
        语法:

/*父元素>子元素*/
div>a {
    color: red;
}3 并集选择器

选择多组标签,设置统一的样式。通常用于集体声明。元素之间用逗号隔开
        语法:       

/*元素1,元素2*/
div, p {
    width: 300px;
}4 伪类选择器

用于给某些选择器添加特定的效果,或者快捷的选定某类元素。最大特点是用冒号':'表示
  • 链接伪类选择器
    • 用于获取链接元素
    /*未访问过的链接*/
    a:link {
        color: black;
    }
    /*已访问过的链接*/
    a:visited {
        color: orange;
    }
    /*鼠标移入状态*/
    a:hover {
        color: red;
    }
    /*激活状态(按下鼠标未松开的状态)的链接*/
    a:active {
        color: skyblue;
    }
  • 链接伪类实际使用
    a {
        color: black;
    }
    a:hover {
        color: red;
    }
  • :focus伪类选择器
    • 用于获取表单元素
    /*当光标在输入框上的时候*/
    input:focus {
        background-color: pink;
    }

5 复合选择器总结 
6 交集选择器

选择一类特定的标签。标签元素和类名之间以点号隔开
语法:

/*标签元素.类名*/
p.class1 { //类名为class1的所有p元素
    color: red;
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值