文档章节

css调式技巧:a.class与a .class的区别, 空格的魅力

筱飞
 筱飞
发布于 2016/03/15 17:58
字数 275
阅读 153
收藏 0

第一组

<a href="http://wszyf2100.blog.163.com/blog/#"><span class="ico-manage">管理</span></a>


使用样式一:

a:hover{color:black}
a:hover.ico-manage{color:red;}


此时鼠标经过”管理“2字,颜色为黑色

使用样式二:

a:hover{color:black}
a:hover .ico-manage{color:red;} //注意空格


此时鼠标经过”管理“2字,颜色为红色



第二组

<a href="http://wszyf2100.blog.163.com/blog/#" class="ico-manage">管理</a>


使用样式一:

a:hover{color:black}
a:hover.ico-manage{color:red;}


此时鼠标经过”管理“2字,颜色为红色

使用样式二:

a:hover{color:black}
a:hover .ico-manage{color:red;} //注意空格


此时鼠标经过”管理“2字,颜色为黑色

总结

对于第一组的a与.ico-manage, .ico-manage属于span标签的,与a不同级;而对于第二组的a与.ico-manage, .ico-manage属于a标签的,即是与a同级,由此可得出一个结论:

1.当class为当前标签中一个属性时,则样式写为:标签+class名

2.当class为子标签的一个属性时,则样式写为:标签+空格+class名


本文转载自:http://www.uzzf.com/news/8153.html

筱飞
粉丝 15
博文 145
码字总数 22847
作品 0
虹口
前端工程师
私信 提问
web前端初学者必看css技巧规范(转)

1、善用css缩写可以减少页面文件大小,提高下载速度,同时使代码简洁可读。 如: 1. border-top:1px solid #cccccc; border-left:1px solid #cccccc; border-right:1px soli #cccccc; borde...

乐派电影
2014/01/11
279
2
从 CSS Lint 出发,谈样式优化

原文出处:http://ued.sina.com/?p=593 CSS Lint,lint是线头的意思,大概意思就是说要找出我们写的css代码里的一些线头,help you code better! CSS Lint的检测规则包括错误的和警告,当选择...

小编辑
2011/09/28
395
2
有利于SEO的DIV+CSS的命名规则小结

有利于SEO的DIV+CSS的命名规则小结 由于项目中编写文档结构、编写CSS的人员较多,并与程序员协同工作,所以就需要统一开发规范,根据XHTMl和CSS编织的规范和大多人的习惯,整理了以下针对本项...

MyDear宸
2017/05/15
0
0
有利于SEO的DIV+CSS的命名规则小结

有利于SEO的DIV+CSS的命名规则小结 由于项目中编写文档结构、编写CSS的人员较多,并与程序员协同工作,所以就需要统一开发规范,根据XHTMl和CSS编织的规范和大多人的习惯,整理了以下针对本项...

MyDear宸
2017/05/12
0
0
CSS设计模式:OOCSS 和 SMACSS

原文出处:ChingJanjo 真心觉得写出 CSS 并不难,但是要写出可被维护的 CSS 比其他程式语言都还难。所幸已经有许多大师级的人物,提出许多设计模式和思维,借由站在巨人的肩膀上可以让事情事...

ChingJanjo
2014/08/26
0
0

没有更多内容

加载失败,请刷新页面

加载更多

mysql-connector-java升级到8.0后保存时间到数据库出现了时差

在一个新项目中用到了新版的mysql jdbc 驱动 <dependency>     <groupId>mysql</groupId>     <artifactId>mysql-connector-java</artifactId>     <version>8.0.18</version> ......

ValSong
今天
5
0
Spring Boot 如何部署到 Linux 中的服务

打包完成后的 Spring Boot 程序如何部署到 Linux 上的服务? 你可以参考官方的有关部署 Spring Boot 为 Linux 服务的文档。 文档链接如下: https://docs.ossez.com/spring-boot-docs/docs/r...

honeymoose
今天
6
0
Spring Boot 2 实战:使用 Spring Boot Admin 监控你的应用

1. 前言 生产上对 Web 应用 的监控是十分必要的。我们可以近乎实时来对应用的健康、性能等其他指标进行监控来及时应对一些突发情况。避免一些故障的发生。对于 Spring Boot 应用来说我们可以...

码农小胖哥
今天
9
0
ZetCode 教程翻译计划正式启动 | ApacheCN

原文:ZetCode 协议:CC BY-NC-SA 4.0 欢迎任何人参与和完善:一个人可以走的很快,但是一群人却可以走的更远。 ApacheCN 学习资源 贡献指南 本项目需要校对,欢迎大家提交 Pull Request。 ...

ApacheCN_飞龙
今天
5
0
CSS定位

CSS定位 relative相对定位 absolute绝对定位 fixed和sticky及zIndex relative相对定位 position特性:css position属性用于指定一个元素在文档中的定位方式。top、right、bottom、left属性则...

studywin
今天
9
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部