CSS 组合选择器
CSS 组合选择器
注：使用逗号分隔，同时应用。
多个id选择器拼接到一起
含有：i1 i2 i3的标签同时应用css样式。
<html>
<head>
<!-- style 设置头部标签 -->
<style>
/*可将多个id选择器名称拼接到一组*/
#i1,#i2,#i3{
/* 改变背景颜色 */
background-color: #2459a2;
/* 改变字体颜色 */
color: white;
}
</style>
</head>
<body>
<div id="i1">1</div>
<div id="i2">2</div>
<div id="i3">3</div>
</body>
</html>
多个class选择器拼接到一起
含有：i1 i2 i3的标签同时应用css样式。
<html>
<head>
<!-- style 设置头部标签 -->
<style>
/*可将多个class类选择器名称拼接到一组*/
.i1,.i2,.i3{
background-color: #2459a2;
color: white;
}
</style>
</head>
<body>
<div class="i1">1</div>
<div class="i2">2</div>
<div class="i3">3</div>
</body>
</html>
CSS 组合选择器的更多相关文章
- python 46 css组合选择器 及优先级 、属性选择器
一:css组合选择器 特性:每个选择器位可以为任意基本选择器或选择器组合 选择器分为以下几类: 群组选择器,子代(后代)选择器,相邻(兄弟)选择器,交集选择器,多类名选择器 1.群组选择器: d ...
- [04-01]css组合选择器
/* 私人笔记 */ 组合选择器:把基本选择器通过特殊符号串在一起,可以带来一些特殊的意义: 1.源码 <!DOCTYPE html> <html lang="zh&q ...
- CSS【04】：CSS组合选择器
组合选择器 群组(并集)选择器 作用:给所有选择器选中的标签设置属性,可以同时控制多个选择器 格式: 选择器1, 选择器2 { 属性: 值; } 注意点: 必须使用,来连接 选择器可以使用标签名称.i ...
- css组合选择器
组合选择器:1,后代选择器 .main h2 {...}, 使用空格表示 IE6+2,子选择器 .main>h2 {...}, 使用 > 表示 IE7+3,兄弟选择器 h2+p {...} ...
- CSS_03_01_CSS组合选择器
CSS组合选择器 第01步:创建css:with.css @charset "utf-8"; /* 组合选择器,用","隔开 */ .a,.b,div span ...
- CSS 简介、 选择器、组合选择器
#CSS 装饰器引入<!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- 2、前端--初见前后端交互、CSS简介、基本选择器、组合选择器、属性选择器、分组与嵌套、伪类选择器
今日内容概要 初窥后端框架 css简介 css选择器 今日内容详细 初次体验前后端交互 # 代码无需掌握 只看效果即可 """后端框架:可以简单的理解为别人写好的一个非常 ...
- from表单、css选择器、css组合器、字体样式、背景属性、边框设置、display设置
目录 一.form表单 1.form表单功能 2.表单使用原理 二.前端基础之css 1.关于css的介绍 2.css语法 3.三种编写CSS的方式 3.1.style内部直接编写css代码 3.2. ...
- 前端知识之CSS(1)-css语法、css选择器（属性、伪类、伪元素、分组与嵌套）、css组合器
目录 前端基础之css 1.关于css的介绍 2.css语法 3.三种编写CSS的方式 3.1.style内部直接编写css代码 3.2.link标签引入外部css文件 3.3.标签内直接书写 4.c ...
随机推荐
- array_walk与array_map的区别
1.array_walk是用于用户自定义的函数,所以想用array_walk($aIds, "trim");去掉数据元素中的空格是达不到目的的只能用array_walk($aIds ...
- yum安装mysql-5.6(centos7)
centos 7.3 安装mysql 5.6 rpm -Uvh http://dev.mysql.com/get/mysql-community-release-el7-5.noarch.rpm yu ...
- JAVA课程课后作业03之作业一
作业:使用类的静态字段和构造函数,可以跟踪某个类所创建对象的个数.请写一个类,在任何时候都可以向它查询“你已经创建了多少个对象?”. 代码: package TestJava; import java ...
- Nestjs 接口验证
class-validator Nestjs yarn add class-transformer class-validator main.ts import { NestFactory } fro ...
- Spring AOP 随记
本周经历各种面试失败后,最后一站张建飞老大的阿里,感觉有着这般年纪不该有的垃圾履历而忧伤中,不过还是要继续加油的,毕竟他说的好,都是经历,无愧初心. 所以为了更加深入理解Spring AOP我又翻起了 ...
- 合并两个git仓库并保留提交记录
case如下: 有2个git仓库:repo1.repo2: 想将repo1中的文件移入repo2: repo1的历史日志要保留: 1 2 # 1.将repo1作为远程仓库,添加到repo2中,设置 ...
- 20175320 2018-2019-2 《Java程序设计》第2周学习总结
20175320 2018-2019-2 <Java程序设计>第2周学习总结 教材学习内容总结 本周学习了教材的第二章及第三章的内容.在这两章中介绍了Java编程中的基本数据类型与数组以及 ...
- apache tomcat (catalina)查版本（solaris/unix）
先进到tomcat的bin目录下(cd /tomcat目录/bin),在执行./version.sh https://blog.csdn.net/vv___/article/details/78653 ...
- Linux 中如何用源代码安装软件，以及如何卸载它
https://www.linuxidc.com/Linux/2017-12/149839.htm http://www.openssh.com/ http://www.openssh.com/por ...
- openERP笔记，自定义开发模块
##目标 OpenERP模块基本结构 使用模块添加额外的字段(Date Required和Rush Order) 扩展视图, 让OpenERP能够显示新的字段 修改用于OpenERP工作流的可用状态 ...