<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <style>

        /*相邻兄弟选择器*/

        /*h1 + p{

            color: red;

        }*/

        /*通用兄弟选择器*/

        h1 ~ p{

            color: red;

        }

    </style>

    <title>相邻兄弟选择器,通用兄弟选择器</title>

</head>

<body>

<!--相邻兄弟选择器   相邻的兄弟，必须严格相邻，不允许出现其他元素间隔-->

<!--通过兄弟选择器   所有的同级兄弟  不要求严格相邻 -->

<h1>好好学习</h1>

<span>ccy</span>

<p>好好学习1</p>

<p>好好学习2</p>

<p>好好学习3</p>

<p>好好学习4</p>

<p>好好学习5</p>

</body>

</html>

　　

04.CSS选择器-->相邻、通用兄弟选择器的更多相关文章

  1. css 通用兄弟选择器( ~ )

    stylus设置兄弟元素样式: 鼠标浮动在 .video-li 元素上时,.video-li 兄弟中 .video-info 下的 .word 显示. .video-li &:hover ~ ...

  2. css兄弟选择器，+ ~选择器的区别

     壹 ❀ 引 实习生在写搜索框下拉提示时,遇到了不知道怎么解决的问题,所以来问我.效果不难,鼠标选中输入框(focus)时,展示搜索关键字相关提示,看了眼dom结构是这样的: 在她的理解里面,选中父元 ...

  3. 使用CSS兄弟选择器完成复杂垂直边距（vertical margins）的设计

    -------------------sibling选择器如何在完成复杂设计要求的同时,保持CSS可读 这是web前端开发过程中开始简单逐步变的复杂的例子之一:将一篇文章中的所有元素应用垂直边距(ve ...

  4. CSS选择器之兄弟选择器（~和+）

    今天在改以以前人家写的网页的样式的时候,碰到这个选择器,‘~’,当时我是懵逼的,傻傻分不清 ‘+’ 跟 ‘~’的区别,虽然我知道他们都是兄弟选择器. 后来网上查了下,也许是我查找的方式不对,没有找到我 ...

  5. Day5 CSS基本样式和C3选择器

    Day5 CSS基本样式和C3选择器 一.背景属性 1.背景颜色            background-color:transparent(默认值,透明); 颜色的取值:            ...

  6. CSS选择器有哪些？选择器的优先级如何排序？

    CSS选择器分类: CSS的选择器分类可以分为三大类:id选择器,类选择器,标签选择器. 用法如下: 选择器   e.g. 说明 id选择器 #id #header 选择id="header ...

  7. 第49天学习打卡（CSS 层次选择器 结构伪类选择器 属性选择器 美化网页元素 盒子模型）

    推荐书籍:码出高效: Java 开发手册 2.2 层次选择器 idea里代码规范是按:ctrl +alt+L快捷键 注释快捷键:ctrl+/ 1.后代选择器:在某个元素的后面 祖爷爷 爷爷 爸爸 你 ...

  8. 兄弟选择器 E + F

    兄弟选择器在IE7下支持会有bug,特记于此 如果兄弟选择器有Html注释,兄弟选择器在IE7下会失效  代码如下 E + Fp + p{color:red} <p class="te ...

  9. HTML连载20-并集选择器&兄弟选择器

    一.并集选择器 1.作用:给所有的选择器选中的标签设置属性. 2.格式: 选择器1,选择器2{ 属性:值: } 3.例如: .abc1,#abc2{ color:red; } .......省略代码. ...

随机推荐

  1. Java_多线程2_线程池

    线程池(pool): 线程池的作用: 1.节省资源,减少线程的数量和创建销毁线程的开销2.合理的管理线程的分配 线程池的创建: 1.newCachedThreadPool //优点:很灵活,弹性的线程 ...

  2. Linux之解决命令行cat命令中文乱码

    临时解决cat中文乱码 cat test.txt | iconv -f GBK -t UTF-8

  3. 类型转换：static_cast、reinterpret_cast等

    一.隐式类型转换 系统自动进行,不需要程序开发人员介入. int m = 3 + 45.6;// 48 把小数部分截掉,也属于隐式类型转换的一部分 double b = 3 + 45.6; // 48 ...

  4. 架构师养成记--30.Redis环境搭建

    Redis的安装 下载地址http://redis.io/download 安装步骤: 首先需要安装gcc,把下载好的redis-3.0.0-rc2.tar.gz 放到 /usr/local 文件夹下 ...

  5. 判断h5页面是小程序环境还是微信环境

    1.话不多说直接上代码,已使用有效 <script type="text/javascript" src="https://res.wx.qq.com/open/j ...

  6. 基于聚类的“图像分割”(python)

    基于聚类的“图像分割” 参考网站: https://zhuanlan.zhihu.com/p/27365576 昨天萌新使用的是PIL这个库,今天发现机器学习也可以这样玩. 视频地址Python机器学 ...

  7. python实现计算器功能

    import re def strip_operate(exp): # 合并多余的操作符 exp = exp.replace("+-", "-") exp = ...

  8. java基本编译

    1.java语言严格区分大小写:1个源文件其中最多只能有一个public类:源文件必须和public类同名:每个类对应一个class字节码,且同名. 2.编译.   javac -d dir Hell ...

  9. Mac 10.12安装飞鸽传书IPMessager

    说明:这个版本的飞鸽传书不能和Linux的互通,但是可以和Windows的互通,我猜测是协议问题:如果想要互通只能是Mac和Linux同时安装iptux. 下载: (链接: https://pan.b ...

  10. （转）生活中的OO智慧——大话面向对象五大原则

    一·单一职责原则(Single-Responsibility Principle) 定义:一个对象应该只包含单一的职责,并且该职责被完整地封装在一个类中. 宿舍里并不能好好学习,自习还是得去图书馆.这 ...