17-兄弟选择器


我是标题

我是超链接

我是段落

我是段落

我是段落

我是标题

我是段落

我是段落

我是段落

-->

我是标题

我是超链接

我是段落

我是段落

我是超链接

我是段落

我是标题

我是段落

我是段落

我是段落

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>17-兄弟选择器</title>
<style>
/*
h1+p{
color: red;
}
*/
h1~p{
color: green;
}
</style>
</head>
<body>
<!--
1.相邻兄弟选择器 CSS2
作用: 给指定选择器后面紧跟的那个选择器选中的标签设置属性 格式:
选择器1+选择器2{
属性:值;
} 注意点:
1.相邻兄弟选择器必须通过+连接
2.相邻兄弟选择器只能选中紧跟其后的那个标签, 不能选中被隔开的标签 2.通用兄弟选择器 CSS3
作用: 给指定选择器后面的所有选择器选中的所有标签设置属性 格式:
选择器1~选择器2{
属性:值;
} 注意点:
1.通用兄弟选择器必须用~连接
2.通用兄弟选择器选中的是指定选择器后面某个选择器选中的所有标签, 无论有没有被隔开都可以选中
--> <!--
<h1>我是标题</h1>
<a href="#">我是超链接</a>
<p>我是段落</p>
<p>我是段落</p>
<p>我是段落</p>
<h1>我是标题</h1>
<p>我是段落</p>
<p>我是段落</p>
<p>我是段落</p>
-->
<h1>我是标题</h1>
<a href="#">我是超链接</a>
<p>我是段落</p>
<p>我是段落</p>
<a href="#">我是超链接</a>
<p>我是段落</p> <h1>我是标题</h1>
<p>我是段落</p>
<p>我是段落</p>
<p>我是段落</p>
</body>
</html>

H5 17-兄弟选择器的更多相关文章

  1. H5C3--属性选择器、兄弟选择器、伪类选择器

    属性选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  2. CSS 相邻兄弟选择器

    相邻兄弟选择器(Adjacent sibling selector)可选择紧接在另一元素后的元素,且二者有相同父元素. 选择相邻兄弟 如果需要选择紧接在另一个元素后的元素,而且二者有相同的父元素,可以 ...

  3. CSS相邻兄弟选择器

    相邻兄弟选择器定义:选择紧接在另一个元素后的元素,而且两者有着相同的父元素. 代码一:<body> <h1>This is a heading.</h1> < ...

  4. CSS后代选择器,子选择器和相邻兄弟选择器

    平时在代码练习中,经常用到后代选择器,子选择器也会用到,这里做个总结: 1,后代选择器和子选择器区别: ①写法不一样:后代选择器的标识为:空格 如:ul li{width:150px;} [ul和li ...

  5. 兄弟选择器 E + F

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

  6. web CSS的知识- 关于后代选择器,子选择器,兄弟选择器的使用

    1. 后代选择器官方解释:后代选择器可以选择作为某元素后代的元素.理解:选择某一标签的后代中,所有的此标签标记例:ul em {color:red;}就是选择,h1标签后代中中,所有的em.代码如下: ...

  7. CSS后代选择器、子元素选择器、相邻兄弟选择器区别与详解

    派生选择器用的很多,派生选择器具体包括为后代选择器.子元素选择器.相邻兄弟选择器,我们来理解一下他们之间的具体用法与区别. 1.css后代选择器语法:h1 em {color:red;} 表示的是从h ...

  8. 使用CSS兄弟选择器完成复杂垂直边距(vertical margins)的设计

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

  9. 理解css相邻兄弟选择器

    今天在菜鸟教程看到了css组合选择符的“相邻兄弟选择器”,刚开始对这个概念有些不太理解,通过查阅资料并且经过一些试验总算有了些头绪. 原文解释是“相邻兄弟选择器(Adjacent sibling se ...

随机推荐

  1. [20180828]exadata--豆腐渣系统的保护神.txt

    [20180828]exadata--豆腐渣系统的保护神.txt --//昨天看awr报表发现如下,时间8-9点报表,这个时间病房业务很少,主要门诊的业务: 1.awr报表情况:Top 10 Fore ...

  2. 关于linux 安装libxml2

    安装php的时候提示libxml2 未安装 从服务器安装libxml2 提示 libxml.c:3821: error: expected '=', ',', ';', 'asm' or '__att ...

  3. 洗礼灵魂,修炼python(91)-- 知识拾遗篇 —— pymysql模块之python操作mysql增删改查

    首先你得学会基本的mysql操作语句:mysql学习 其次,python要想操作mysql,靠python的内置模块是不行的,而如果通过os模块调用cmd命令虽然原理上是可以的,但是还是不太方便,那么 ...

  4. UGUI组件之快速消息提示(飘字)

    效果预览 使用情景 几乎每一个游戏都会有这种飘字提示,实现起来并不复杂, 我把它做了一个组件. 开箱即可使用,无需二次开发,如果效果不满意,开放源码,方便进行调优. 组件源码 核心代码 每次将飘字的请 ...

  5. windowsserver2019系统下载

    windowsserver2019系统分为标准版和数据中心版,两个版本和windows2012,2016一样没有64位系统,点击下载windowsserver2019系统.

  6. mybatis : ERROR. token : COMMA, pos : 373

    查询的字段符号问题,可能是多了" , "  也可能是少了 " , "  仔细检查, 都能解决

  7. C#のsocket通信

    博主要做一个手机和电脑端(C#)通讯的程序,便览了网络上关乎socket的东西.但是接收文件的时候卡住了,怎么也接收不全.后来做了分片处理,如果分片,发送的时候就会有不同的socket(客户端开发不是 ...

  8. js按照特定的中文字进行排序的方法

    之前遇到过按照中文字符排序的需求很顺利的解决了,这次是按照特定的中文字进行排序,比如按照保守型,稳健型,平衡型,成长型,进取型进行排序. 可以使用localeCompare() 方法来实现中文按照拼音 ...

  9. 机器学习算法总结(六)——EM算法与高斯混合模型

    极大似然估计是利用已知的样本结果,去反推最有可能(最大概率)导致这样结果的参数值,也就是在给定的观测变量下去估计参数值.然而现实中可能存在这样的问题,除了观测变量之外,还存在着未知的隐变量,因为变量未 ...

  10. 根据JavaBean创建数据库的操作SQL

    根据JavaBean创建数据库的操作SQL import java.lang.reflect.Field; public class GenerateSQL { public static void ...