CSS中关于多个class样式设置的不同写法
html中:
<div class="containerA"> 这是AAAAAAAAAAAAAAAAAAAAAAA样式 <div class="containerB"> 这是BBBBBBBBBBBBBBBBBBBBBB样式 </div> </div>
css中:
.containerA .containerB {
color: red;
font-size: 28px;
}
.containerA ,.containerB { color: red; font-size: 28px; }
这两种写法是有区别的,前者用空格隔开,表示接下来对A下面的B样式进行修改。
如图:
而后者用逗号隔开,表示接下来对A和B两者的样式都进行修改。
如图:
虽然,我们再用的时候往往两者没啥区别,但是还是要理解它的原理,有时候在一些样式需要change的时候(用空格分开)还是很管用的!
---------------------
作者:黑子Kuroko
来源:CSDN
原文:https://blog.csdn.net/fifteen718/article/details/51149114
版权声明:本文为博主原创文章,转载请附上博文链接!
CSS中关于多个class样式设置的不同写法的更多相关文章
- CSS中对图片(background)的一些设置心得总结
写网页的时候很多情况需要对图片进行操作,如何在不进行专业的美工裁切操作的情况下而让自己的素材度达到最大的满意度呢,这是一个问题,对于懒得开ps切图的我,通常会直接在网络上download一张图片,直接 ...
- CSS中的ul与li样式详解
CSS中的ul与li样式详解ul和li列表是使用CSS布局页面时常用的元素.在CSS中,有专门控制列表表现的属性,常用的有list-style-type属性.list-style-image属性.li ...
- CSS中的ul与li样式详解 list-type
转自新浪博客http://blog.sina.com.cn/u/2539885750 ul和li列表是使用CSS布局页面时常用的元素.在CSS中,有专门控制列表表现的属性,常用的有list-style ...
- CSS:与input相关的一些样式设置问题
input是HTML中非常重要,非常常用而又不可替代的元素,在于其相关的样式设置中有时会遇到其他元素不会发生的问题,今天把我印象中的一些小问题和解决方案记录一下. 1.与同行元素上下居中对齐 关于上下 ...
- wpf 中DataGrid 控件的样式设置及使用
本次要实现的效果为: 这个DataGrid需要绑定一个集合对象,所以要先定义一个Experience类,包含三个字段 /// <summary> /// 定义工作经历类 /// </ ...
- Dev中GridControl的GridView 基本样式设置
基本样式图: 代码如下: /// <summary> /// gridView样式 /// </summary> /// <param name="gdv&qu ...
- 点击图片或者鼠标放上hover .图片变大. 1)可以使用css中的transition, transform 2) 预先设置一个 弹出div. 3)弹出层 alert ; 4) 浏览器的宽度document.documentElement.clientWidth || document.body.clientWidth
变大: 方法一: 利用css属性. 鼠标放上 hover放大几倍. .kecheng_02_cell_content img { /*width: 100px; height: 133px;*/ wi ...
- CSS中margin: 0 auto;样式没有生效
问题:有两个元素: A, B.两则是嵌套关系,A是B的父节点.A和B都是块元素.当在A上设置:margin: 0 auto的时候,B并没有在页面中居中. margin: 0 auto 为什么没有生效? ...
- table中某一个tr边框样式设置
<html> <head> <style type="text/css"> table{ width:500px; } table tr td{ ...
随机推荐
- haproxy Mycat集2---KeepAlived
KA 配两台 MASTER,BACKUP节点 安装Keepalived 1.下载安装依赖包 yum install -y wget make gcc openssl-devel popt-devel ...
- 随笔-ansible-2
通过Ansible来搭建一套Web服务架构.[以AD-HOC的形式] Inventory文件内容如下: [proxy] 192.168.40.254 [app] 192.168.40.243 [nos ...
- JDBC_入门及注入问题
.JDBC基本概念: java database Connectivity java数据库连接,java语言操作数据库 本质: 官方定义的一套操作所有关系型数据库的规则,即接口. 各个数据库厂商实现这 ...
- sql 保存,性能高
INSERT INTO TABLE( Id, Name) VALUES ( 4, 'A'), ( 5, 'P' ),( 6, 'U') ; INSERT INTO TABLE( Id, Name) S ...
- 编译 GNU binutils
重新以 arm 用户登陆,让新设置的环境变量起作用. [arm@localhost arm]#su arm [arm@localhost arm]#cd ${SRC} [arm@localhost t ...
- 【笔记篇】单调队列优化dp学习笔记&&luogu2569_bzoj1855股票交♂易
DP颂 DP之神 圣洁美丽 算法光芒照大地 我们怀着 崇高敬意 跪倒在DP神殿里 你的复杂 能让蒟蒻 试图入门却放弃 在你光辉 照耀下面 AC真心不容易 dp大概是最经久不衰 亘古不化的算法了吧. 而 ...
- 跟我一起使用Vue.js + Docker 部署项目
本文学习自:https://juejin.im/post/5bee5ddde51d457b8a33938c 项目环境是在ubuntu下,记得要在root目录下,不然安装vue会报错 npm insta ...
- Android开发 navigation入门详解
前言 Google 在2018年推出了 Android Jetpack,在Jetpack里有一种管理fragment的新架构模式,那就是navigation. 字面意思是导航,但是除了做APP引导页面 ...
- servlet的抽取
servlet的抽取 servlet按照模块来划分,比如注册和登录的servlet就放到user的servlet中 原来: 登录时登录的servlet 注册时注册的servlet 现在: 登录注册的s ...
- 宇宙最强 IDE:VS 2019 正式发布
作者:局长 来源:www.oschina.net/news/105629/ 如约而至,微软已于今天推出 Visual Studio 2019 正式版,一同发布的还有 Visual Studio 201 ...