1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>高级选择器</title>
  6.     <style>
  7.         /*交集选择器*/
  8.         /*既是P标签，类名称又会text的元素字体变为红色*/
  9.         p.text{
  10.             color: red;
  11.         }
  12.         /*并集选择器*/
  13.         /*让container下的所有元素内容为蓝色*/
  14.         #container p,span,em,strong{
  15.             color: blue;
  16.         }
  17.     </style>
  18. </head>
  19. <body>
  20.     <!--交集选择器-多个选择器包含的元素-->
  21.     <p>好好学习1</p>
  22.     <p class="text">好好学习2</p>
  23.     <p class="text">好好学习3</p>
  24.     <p>好好学习4</p>
  25.  
  26.     <!--并集选择器-多个选择所有匹配的元素-->
  27.     <div id="container">
  28.         <p>好好学习1</p>
  29.         <span>好好学习2</span><br>
  30.         <em>好好学习3</em><br>
  31.         <strong>好好学习4</strong>
  32.     </div>
  33.  
  34. </body>
  35. </html>

03.CSS选择器-->交集并集选择器的更多相关文章

  1. CSS 交集选择器和并集选择器

    交集选择器是and 也就是要同时满足 且只能交2个只能交2个只能交2个,第一个是标记,第二个是class或者id,之间不可以有空格 eg:  span.small-height 并集选择器是or,也就 ...

  2. 使用CSS的类名交集复合选择器

    首先先看一下基本定义: 复合选择器就是两个或多个基本选择器,通过不同方式连接而成的选择器,主要包括“交集”选择器.“并集”选择器.“后代”选择器. 交集选择器 “交集”复合选择器是由两个选择器直接连接 ...

  3. 使用css的类名交集复合选择器 《转》

    复合选择器就是两个或多个基本选择器,通过不同方式连接而成的选择器,主要包括“交集”选择器.“并集”选择器.“后代”选择器. 交集选择器 “交集”复合选择器是由两个选择器直接连接构成,其结果是选中二者各 ...

  4. CSS样式----图文详解：css样式表和选择器

    主要内容 CSS概述 CSS和HTML结合的三种方式:行内样式表.内嵌样式表.外部样式表 CSS四种基本选择器:标签选择器.类选择器.ID选择器.通用选择器 CSS三种扩展选择器:组合选择器.后代选择 ...

  5. python 全栈开发，Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  6. CSS样式----css样式表和选择器（图文详解）

    本文最初于2015-10-03发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 本文主要内容 CSS概述 CSS和HTML结合的三种方式:行内样 ...

  7. CSS基础语法与选择器

    CSS基础 语法 : <head> <style type="text/css"> 选择器(即修饰对象){ 修饰属性:属性值; 修饰属性:属性值; } &l ...

  8. css的高级选择器,后代选择器,子代选择器,并集选择器,交集选择器

    高级选择器: 后代选择器 子代选择器 并集选择器 交集选择器 一.后代选择器: 使用空格表示后代选择器,父元素的后代(包括儿子,孙子,从孙子) 也就是说,box类下的所有span标签 字体颜色都被设置 ...

  9. python 之 前端开发（基本选择器、组合选择器、 交集与并集选择器、序列选择器、属性选择器、伪类选择器、伪元素选择器）

    11.3 css 11.31 基本选择器 11.311 id选择器 根据指定的id名称,在当前界面中找到对应的唯一一个的标签,然后设置属性 <!DOCTYPE html> <html ...

随机推荐

  1. 根据域名获取ip地址gethostbyname

    #include <sys/socket.h> #include <stdio.h> #include <netdb.h> int main(int argc, c ...

  2. java 字符串(String)常用技巧及自建方法模块汇总

    1.String类常用方法汇总 (1)删除字符串的头尾空白符 public String trim() (2)从指定位置截取字符串 public String substring(int beginI ...

  3. CF917D. Stranger Trees & TopCoder13369. TreeDistance（变元矩阵树定理＋高斯消元）

    题目链接 CF917D:https://codeforces.com/problemset/problem/917/D TopCoder13369:https://community.topcoder ...

  4. 使用二叉搜索树实现一个简单的Map

    之前看了刘新宇大大的<算法新解>有了点收获,闲来无事,便写了一个二叉搜索树实现的Map类. java的Map接口有很多不想要的方法,自己定义了一个 public interface IMa ...

  5. dp--2019南昌网络赛B-Match Stick Game

    dp--2019南昌网络赛B-Match Stick Game Xiao Ming recently indulges in match stick game and he thinks he is ...

  6. Mac下Homebrew安装的软件放在什么地方

    一般情况是这么操作的: 1.通过brew install安装应用最先是放在/usr/local/Cellar/目录下. 2.有些应用会自动创建软链接放在/usr/bin或者/usr/sbin,同时也会 ...

  7. Mac下开机启动rc.common不生效的问题

    经过测试在10.12.6下/etc/rc.common不生效,原因是已经被launchd守护进程所取代,虽然保留着这个文件,但是基本是不起作用的. 如果要开机启动请直接使用launchd进行操作. 同 ...

  8. spring boot快速入门 1 ：创建项目、 三种启动项目方式

    准备工作: (转载)IDEA新建项目时,没有Spring Initializr选项 最近开始使用IDEA作为开发工具,然后也是打算开始学习使用spring boot. 看着博客来进行操作上手sprin ...

  9. HTTP传输数据压缩

    一.基础 1.HTTP压缩是指: Web服务器和浏览器之间压缩传输的”文本内容“的方法. HTTP采用通用的压缩算法,比如gzip来压缩HTML,Javascript, CSS文件. 能大大减少网络传 ...

  10. PHP 对字符串 进行填充

    1.str_pad — 使用另一个字符串填充字符串为指定长度 . 我觉得str_pad可以满足普通的数字,字符串的简单填充. string str_pad ( string $input , int ...