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. [20190130]删除tab$记录的恢复2.txt

    [20190130]删除tab$记录的恢复2.txt --//前面链接写好了脚本,开始测试删除后的恢复.千万不要在生产系统做这样的测试!!--//参考链接:http://blog.itpub.net/ ...

  2. javascript中(function($){...})(jQuery)写法是什么意思

    这里实际上是匿名函数function(arg){...}这就定义了一个匿名函数,参数为arg 而调用函数 时,是在函数后面写上括号和实参的,由于操作符的优先级,函数本身也需要用括号,即:(functi ...

  3. Jenkins2.32打包Unity项目的记录

    前言 使用jenkins来打包unity3d的工程. jenkins :2.50 /2.32.3(长期支持版 建议使用此版本) 操作系统:windows 7 x64 sp1 (打包安卓和win) ,m ...

  4. node express 上传文件

    npm install --save multer var fs = require('fs'); var multer = require('multer'); var upload = multe ...

  5. 5.05-requests_cookies2

    import requests # 请求数据url member_url = 'https://www.yaozh.com/member/' headers = { 'User-Agent': 'Mo ...

  6. 并发控制--Concurrency control--乐观、悲观及方法

    In information technology and computer science, especially in the fields of computer programming, op ...

  7. SQLite的sqlite3_prepare_v2

    original SQL text---<sqlite3_prepare_v2>--->sqlite3_stmt--<sqlite3_reset>-->clear  ...

  8. 使用c#封装海康SDK出现无法加载 DLL“..\bin\HCNetSDK.dll”: 找不到指定的模块

    最近在研究网络摄像头的二次开发,测试了一款海康威视的网络摄像头,程序调试的时候,出现如题的报错. 调试随机自带的demo时,程序运行正常,但当把该程序引入到我自己的程序中时,就开始报错.根据开发软件包 ...

  9. hash_hmac 签名

    <?php /** * =========================================================== * Model_Base * Descriptio ...

  10. jenkins使用1----初始化设置

    ####一.基本设置 1.首先找到系统管理 2.再找到全局配置一把黄色的锁头 3.新增JDK.Maven等 别名随便 下面的值添加jdk在jenkins这台机器上的位置,如果没找到可以点击自动安装,并 ...