CSS中交集选择器详解

最新推荐文章于 2022-10-04 19:26:43 发布
最新推荐文章于 2022-10-04 19:26:43 发布
阅读量7.4k 收藏 2
点赞数
分类专栏： css 文章标签： CSS 交集选择器
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hxy19971101/article/details/51858241
版权
本文详细介绍了CSS中的交集选择器，包括类选择器与ID选择器的使用。通过实例代码展示了如何使用p.specialone{}和p#specialtwo{}选择器改变元素样式，实验证明这两种交集选择器均能有效应用。
摘要由CSDN通过智能技术生成

  CSS中交集选择器有两种，分别是例如 p.special{} 以及p#special类似的两种

交集选择器中不能有空格，下面是测试代码

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">

p{

color:green

}
p.specialone{


color:blue
}
p#specialtwo{

color:red;

}
</style>
<title>交集选择器测试</title>
</head>


<body>
<p class="specialone">交集选择器</p>

最低0.47元/天 解锁文章
潇遥快乐
关注
专栏目录
7.CSS-交集选择器、并集选择器、兄弟选择器
Veronnit的博客
07-13 1885
文章目录*交集选择器作用格式注意点并集选择器作用格式注意点相邻兄弟选择器作用格式注意点通用兄弟选择器作用格式注意点 *交集选择器 作用 给所有选择器选中的标签中，相交的那部分设置属性。 格式 选择器1 选择器2{ 属性：值； } 注意点 1.选择器和选择器之间没有任何连接符号； 2.选择器可以使用标签名称/id名称/class名称； 3.仅了解。 并集选择器 作用 给所有选择器选中的标签设置属性。 格式 选择器1，选择器2{ 属性：值； } 注意点 1.并集选择器必须使用，来连接； 2.选择器可以使用
CSS-高级选择器，后代选择器、交集选择器、并集选择器，伪类选择器的用法详解
weixin_44486539的博客
09-28 1205
常见的高级选择器有后代选择器、交集选择器、并集选择器 后代选择器 选择器之间用空格隔开就是后代选择器 选择的是后代元素，不一定是儿子元素，后代选择器描述的是祖先结构 使用规则：外层标签写在前面，内层标签写在后面，中间用空格分隔，先写父亲爷爷，再写儿子孙子 示例： <div class="box"> <ul> <li> <p>段落&lt...
css并集交集选择器
toufachangdehen的博客
05-20 311
css并集交集选择器
css交集选择器、并集选择器、兄弟选择器
热门推荐
haha_hello的博客
02-10 6万+
一，交集选择器<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>15-css交集选择器.html</title> <!-- 交集选择器,相交的部分就是要设置属性值的标签 1,格式: 选择器1选择器2...{ 属性:值
CSS交集选择器
xyjikl
07-17 9268
CSS交集选择器的格式 第一种格式类似于： h1.center {color:red; text-align:center;} 这种格式由标签选择器和类选择器组成。 第二种格式类似于： h1#center {color:red; text-align:center;} 这种格式由标签选择器和id选择器组成。 两个选择器之间不能有空格，必须连续书写。 以上这两
CSS交集选择器，并集选择器
weixin_72322475的博客
08-07 6248
举例介绍CSS交集选择器，并集选择器
CSS复合选择器详解：后代选择器、子元素选择器、交集选择器和并集选择器
CSS复合选择器详解 CSS复合选择器是CSS选择器中的一种，用于选择更准确、更精细的目标元素标签。它是由两个或多个基础选择器，通过不同的方式组合而成的。下面将详细介绍四种常见的CSS复合选择器：后代选择器、子...
css：超全选择器详细介绍以及优先级
YangLu888
10-04 2965
引入css的四种方式以及优先级；css选择器的超全详细介绍以及选择器的各种优先级；nth-of-type和nth-child的区别。
万字详解CSS中的基础选择器
一碗周
08-19 205
Hello 大家好，我是彼岸繁華????，一个坚信努力可以改变命运的前端????????‍????，如果有幸写的文章可以得到你的青睐，万分有幸~ 这是【从头学前端】系列文章的第十七篇-《CSS基本选择器的用法》 编写不易转载请获得允许 写在前面 本篇文章将来学习CSS中的选择器，通过本篇文章可以掌握什么内容呢？如下图： 本篇文章大概万字，阅读完大概会花费半小时的时间，建议点赞收藏慢慢读。 CSS选择器概述 什么是选择器 CSS选择器 的作用是按照CSS规则定位HTML页面的一个或多个元素 。浏览器在
css选择器
star3175的博客
09-22 153
span2是子元素的子元素span2是子元素的子元素这个元素不会被应用样式这个元素会被应用样式a:visited{ css样式 } //链接被访问过后。a:hover{ css样式 } //链接被鼠标悬停。span1是子元素span1是子元素
CSS基础知识汇总{主要内容： CSS语法结构，类选择器，后代选择器，交集选择器等}
qq_40947819的博客
03-14 614
1、CSS的作用： 通过css达到美化网页的效果 2、选择器： ✔ 基础选择器（重点） ◆标签选择器（重点学习） ◆类选择器（重点学习） ◆ID选择器 ◆通配符选择器 ✔ 复合选择器（重点） ◆后代选择器（重点） ◆子代选择器 ◆伪类选择器（重点） ◆并集选择器（重点） ◆标签指定式选择器（重点） 类选择器示例： 类选择器特点注意事项： ◆不能使用数字定义类名 ◆不能使用特殊字符定义类名（%，/...
css2.7_交集选择器
每天积累一点点
10-14 2082
问题引入 Document .red{ color: red; } 二级标题 二级标题 二级标题 段落 段落 段落 运行的结果： 我们发现只要是含有red类的标签都变红了 如果我的需求是：只能让h2且含有red类的标签变红，这是就要需要交集选择器 交集选择器 h2.red{ color: red; }上面就是一个交
交集选择器
qq_39093474的博客
08-09 741
1.作用 给所有选择器选中的标签中，相交的那部分标签设置属性 2.格式 /*标签名称1标签名称2{ 属性:值; }*/ divp{ color: red; } 3.注意点 1.选择器与选择器之间不能有任何的连接符号 2.选择器可以是id，类，标签选择器 3.在企业开发中不使用，仅作为理解...
CSS进阶-04-选择器-交集
weixin_63562705的博客
12-08 628
3.1交集选择器:紧挨着 ★作用: 选中页面中同时满足多个选择器的标签 ★选择器语法: 选择器1选择器2 { css } ★结果:(既又原则)找到页面中既能被选择器1选中，又能被选择器2选中的标签，设置样式 ★注意点: 1.交集选择器中的选择器之间是紧挨着的，没有东西分隔 2.交集选择器 中如果有标签选择器，标签选择器必须写在最前面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="
零基础学习CSS(3)——交集选择器、并集选择器、子元素选择器、相邻兄弟选择器、通用兄弟选择器
qq_43650934的博客
10-09 715
官方资料 鱼C课程案例库：https://ilovefishc.com/html5/ html5速查手册：https://man.ilovefishc.com/html5/ css速查手册：https://man.ilovefishc.com/css3/ 学习正文 交集选择器，语法规则：元素选择器 <!DOCTYPE html> <html> <head> <title>交集选择器</title> <meta charset=
H5 15-交集选择器
weixin_30709929的博客
02-24 120
15-交集选择器 我是段落 我是段落 我是段落 我是段落 我是段落 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>15-交集选择器</title> <style> ...
html 交集选择器
雪碧的博客
08-30 3086
!DOCTYPE html> html lang="en" xmlns="http://www.w3.org/1999/xhtml"> head> meta charset="utf-8" /> title>交集选择器title> style> p.para1{
复合选择器-交集选择器
匆匆过客
10-12 1676
1.3 交集选择器 - 条件 交集选择器由两个选择器构成，找到的标签必须满足：既有标签一的特点，也有标签二的特点。 - 语法： - 其中第一个为标签选择器，第二个为class选择器，两个选择器之间**不能有空格**，如h3.special。 **记忆技巧：** 交集选择器 是 并且的意思。 即...又...的意思 比如： p.one 选择的是： 类名为 .one 的 段落标签。 <!DOCTYPE html> <html> <head> ...
通配选择器、交集并集选择器、关系选择器（萌新必看）
qq_45623543的博客
10-18 435
《个人学习笔记十一》 通配选择器 作用：选中页面中的所有元素 语法：*{} 参考代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title>
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值