css选择器——(笔记)
来源:互联网 发布:蔡珍妮淘宝店地址 编辑:程序博客网 时间:2024/06/07 08:44
刚入门不久,最近对css权重搞的头晕眼花,目前接触到的的选择器有,标签选择器,类选择器,id选择器,子选择器,包含后代的选择器,通用选择器,以及伪选择符还有分组选择符。
先声明:内联式>嵌入式>外部式(ps:嵌入式>外部式有个前提,嵌入式的位置一定在外部式的后面)
标签选择器:个人认为,就是声明引用标签的变量,标签的选择器权重值是1
类选择器:.英文(不能用中文),一般使用class这类的来引用,权重是10
id选择器:id=“id名称”,而不是class=“类名称”,权重为100
#strees{color:red}/*下面引用的时候申请的就是*/<span id="strees"></sapn>
/*ID选择器只能使用一次,而类选择器可以多次使用*/
子选择器:用大于号(>),用于指定标签元素的第一代子元素,权重值是0
/*语法*/.friest>li{border:1px solid red;}
包含后代的选择器:加入空格,用于选择制定标签元素下的后辈元素,权重是0
/*选择器与子选择器的区别,子选择器(child selector)仅是指它的直接后代,或者你可以理解为作用于子元素的第一代后代。而后代选择器是作用于所有子后代元素。后代选择器通过空格来进行选择,而子选择器是通过“>”进行选择。*/.first span{color:red}/*>作用于元素的第一代后代,空格作用于元素的所有后代。*/
通用选择器:权重0
*{color:red}
/*作用于所有的标签*/
伪选择符:这个目前没有找到权重
a:hover{color:red}/*hover:声明鼠标经过产生效果(有a href超级链接)如果只是声明<a></a>这个标签只是html标签,在css中鼠标经过的话只要使用img{....}关于伪类选择符,到目前为止,可以兼容所有浏鉴器的“伪类选择符”就是a标签上使用:hover了(其实伪类选择符还有很多,尤其是css3中,但是因为不能兼容所有浏鉴器,本教程只是讲了这一种最常用的)。其实:hover可以放在任意的标签上,比如说p:hover,但是它们的兼容性也是很不好的,所以现在比较常用的还是a:hover的组合。*/
分组选择符:单独设置两个标签的话需要使用这个分组选择符,权重为0
h1{color:red}h2{color:red}只要使用分组选择器h1,h2{color:red}
列子:.frist,#second span{color:green;}
<p class="frist">......</p<span style="font-family:Arial, Helvetica, sans-serif;">></span>
<p id="second">......</p>
/*效果为圈中的class和second的都为绿色*/
0 0
- css选择器——(笔记)
- CSS学习笔记—选择器
- CSS权重,选择器—笔记
- 《CSS权威指南》——笔记2(选择器)
- CSS(三)— 选择器
- css学习笔记——CSS 属性 选择器
- css笔记(二)选择器
- CSS学习笔记-CSS选择器(二)
- CSS学习笔记(三)--CSS选择器
- CSS——选择器
- CSS——选择器
- CSS—组合选择器
- CSS—选择器
- CSS—常用选择器
- js笔记:Js封装库——css选择器
- jQuery笔记1 — hide、show、toggle、css、选择器
- css知识笔记(一)——基础知识、选择器、元素分类
- HTML学习笔记(3)——CSS的引入,选择器和文本样式
- 数据请求未完成pop到上一个页面,发生崩溃情况
- SVN remains in conflict?
- NSPredicate使用及正则表达式简单使用
- Git详细教程,图文并茂,轻松掌握
- cocos2d-x3.2怎么用Eclipse打包
- css选择器——(笔记)
- Working copy XXX locked and cleanup failed in SVN
- 第四章 字符串与多维数组
- IOS 在iPhone上实现简单Http服务
- IE自带的network traffic capturing.
- javascript之Array
- Jsp的构成--jsp中的元素(二)
- Java内存模型详解(JMM)
- 第十五周项目一数组的排序