1.常用的选择器：
①元素选择器   指定希望应用样式的元素.比如：p {color:#fff;}
②后代选择器   寻找特定元素或者元素的后代. 比如：body p{color:#ccc;}   这个选择器和子选择器body>p的区别是：body>p是指body下作为子元素的所有节点P,而后代选择                    是body下面所有的节点P，可以说子元素选择器是一种特殊的后代选择器。

③类选择器  指定特定的类应用样式比如.a{color:#ccc;} 类选择器命名最好根据它用作什么而不是表现什么来命名。如果在文档中添加了许多不必要 的类，那么这可能是文档结                      构不合理的信号。最好根据祖先选择器的后代选择器来选定。
④伪类选择器根据文档结构之外的其他条件对元素应用样式 比如：a:hover{color:red},    :link    :visited称为链接伪类，只能用于锚元素，而:hover :active :focus称为动态伪                    类，理论上可以应用于任何元素，这些伪类可以层叠，创建更复杂的行为                      
⑤通用选择器匹配所有可用元素应用样式（相当于全选），由一个*表示，它可以用来对某个元素的所有后代应用样式，或者跳过一级的后代。
⑥高级选择器之子选择器：如前文  略。
⑦相邻同胞选择器  选取同一个父元素下某个元素之后的第一个同级兄弟元素。可以认为是和JS中的:after选择一个效果

比如 p+div{color:#00f;}就可以实现应用样式

⑧属性选择器可以根据属性的值来寻找元素  比如acronym[title='practise']{bgc:blue;}寻找拥有title属性且值为practised元素应用样式

ps:为了避免样式过分混乱，尽量保持一般样式非常一般，特殊样式非常特殊

继承是指应用样式的元素的后代会继承样式的某些属性，可以通过设置父元素的一般样式来避免子元素标签的过分使用。

现在样式表最常见的是链接样式，这样方法比导入方法快，使用结构良好的单一CSS文件可以显著提高下载速度，但是可以根据实际情况，尽量使代码美观不混乱。

代码的结构设计（！important）

为了便于维护，最好将样式分块

1.一般样式

⑴主体样式

⑵reset样式

⑶链接

⑷标题

⑸其他元素

2.辅助样式

⑴表单

⑵通知和错误

⑶一致的条目

3.页面结构

⑴标题、页脚、导航

⑵布局

⑶其他页面结构元素

4.页面组件

各个页面

5.覆盖样式

在需要的地方加上注释是一种良好的习惯

精通CSS version2笔记之⒈选择器的更多相关文章

  1. 精通CSS version2笔记2.小知识

    添加背景:background-img:url(URL)+属性; 圆角框:选择器{border-radius:单位;}创建X单位的圆角框在元素周围 投影:box-shadow:垂直和水平偏移.投影的宽 ...

  2. 朝花夕拾《精通CSS》二、选择器 & 层叠

    一.背景 翻出我4年前看的<精通CSS>一书,可惜当初没有整理读书笔记的习惯,最近又很少写前端,遂很多东西.知识点遗忘了,恰且现在 css 也有些变化和进步,遂一起打包整理,输出成几篇 b ...

  3. CSS学习笔记之选择器

    目录 1.元素选择器 2.继承 3.选择器分组 4.声明分组 5.后代选择器 6.子元素选择器 7.相邻兄弟选择器 8.类选择器 9.ID 选择器 10.属性选择器 11.伪类 12.伪元素 1.元素 ...

  4. 【精通css读书笔记】 第八章 布局

    学习了css布局的基础后又来翻阅<精通css>这本经典书籍,对布局有了进一步的认识. 基于浮动的布局 两列的布局仍然是使用一个元素向左浮动,一个元素向右浮动,值得注意的是要加入displa ...

  5. CSS学习笔记(1):选择器

    一.元素选择器 HTML文档元素就是最基本的选择器 如: <!DOCTYPE html> <html lang="en"> <head> < ...

  6. CSS 小结笔记之选择器

    Css选择器主要分为以下几类 类选择器 ID选择器 通配符选择器 标签选择器 伪类选择器 复合选择器 1.类选择器:通过.classname 来选择 例如 .color2 { color: rebec ...

  7. 《精通css》笔记

    第2章    选择器,注释 1.要知道常用选择器(id选择器,类选择器,类型选择器,后代选择器,伪类选择器(文档结构之外)) 通用选择器(*{    }) 高级选择器(子选择器,相邻同胞选择器,属性选 ...

  8. CSS学习笔记之基本介绍

    1.简介 层叠样式表(Cascading Style Sheets,CSS)允许我们把样式设置存储在文件中,从而将内容与表现分离 当同一个 HTML 元素被不只一个样式定义时,最终的样式确定顺序如下( ...

  9. 《精通CSS：高级Web标准解决方案》学习笔记（上）

    鉴于国产CSS书籍基本都是辣鸡的现状,我在半年前动用某工作室的购书资金采购了一些技术书籍,这本广受好评的<精通CSS>也在其中.但是在阅读过后我深深的感觉到,如果说CSS本来已经是一种很琐 ...

随机推荐

  1. jQuery构造函数init参数分析（三）

    分析完了字符串情况剩下的就不多了. 5.参数selector是函数 这个就是很容易想到了,首先说一下dom加载.我们通常在head里面写脚本的时候需要等待文档加载在进行处理,js是这么写的 windo ...

  2. 程序新能优化-SQL优化

  3. Vault 不同版本的API的异同

    大家知道,Autodesk Vault 2014有几个版本,依次为( Basic, Workgroup, Professional),不同版本的功能不相同,关于Vault产品功能的不同之处可以在Vau ...

  4. tomcat通过socket连接MySQL，不再占用服务端口【linux】

    MySQL连接方式的说明 http://icbm.iteye.com/blog/1840673 MySQL除了最常见的TCP连接方式外,还提供SOCKET(LINUX默认连接方式).PIPE和SHAR ...

  5. Android压力测试工具——Monkey

    Android压力测试工具——Monkey Monkey是运行在模拟器上和真机设备上的一段程序,它会产生用户事件的一系列伪随机流,比如点击.触摸.手势,还有很多系统级别的事件.Monkey通常是用来做 ...

  6. android 显示 PDF 文件

    1.开源项目地址 : https://github.com/JoanZapata/android-pdfview 2.引用 compile 'com.joanzapata.pdfview:androi ...

  7. Android 手机卫士--自定义组合控件构件布局结构

    由于设置中心条目中的布局都很类似,所以可以考虑使用自定义组合控件来简化实现 本文地址:http://www.cnblogs.com/wuyudong/p/5909043.html,转载请注明源地址. ...

  8. Facebook开源动画库 POP-POPBasicAnimation运用

    动画在APP开发过程中还是经常出现,将花几天的时间对Facebook开源动画库 POP进行简单的学习:本文主要针对的是POPBasicAnimation运用:实例源代码已经上传至gitHub,地址:h ...

  9. 【代码笔记】iOS-时间选择框

    一, 效果图. 二,工程图. 三,代码. RootViewController.h #import <UIKit/UIKit.h> @interface RootViewControlle ...

  10. NuGet学习笔记3——搭建属于自己的NuGet服务器

    文章导读 创建NuGetServer Web站点 发布站点到IIS 添加本地站点到包包数据源 在上一篇NuGet学习笔记(2) 使用图形化界面打包自己的类库 中讲解了如何打包自己的类库,接下来进行最重 ...