CSS1，CSS2选择器详解

第一.CSS1选择器: 1.元素选择器(也叫标签选择器,是最基本的选择器) <style> html{background-color: red;} div{background-color: yellow;} </style> 2.ID选择器(id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式. id 选择器以 "#" 来定义) <style> #boxl{color:blue;} </style> 2.1.结合元素的I…

css 10-CSS3选择器详解

10-CSS3选择器详解 #CSS3介绍 CSS3在CSS2基础上,增强或新增了许多特性, 弥补了CSS2的众多不足之处,使得Web开发变得更为高效和便捷. #CSS3的现状浏览器支持程度不够好,有些需要添加私有前缀移动端支持优于PC端不断改进中应用相对广泛 #应对的策略:渐进增强 (1)坚持渐进增强的原则:让低版本浏览器能正常访问页面,高版本的浏览器用户体验更好.[重要] 比如说,同样是一个头像,可能在低版本的浏览器中,头像方的:在高版本的浏览器中,头像是圆的. (2)考虑用户群体.…

CSS选择器详解（伪类）转 http://blog.csdn.net/Panda_m/article/details/50084699

CSS选择器详解之伪类伪类对大小写不敏感结构伪类选择器结构伪类是CSS3新增的类型选择器,利用DOM树实现元素过滤,通过文档结构的相互关系来匹配元素,可以减少class和id属性的定义,使文档变得更加简洁. :root 选择元素所在文档的根元素.在(X)HTML文档中,根元素始终是html元素. :not() 否定选择器,和jQuery中的:not选择器一模一样,可以选择除某个元素之外的所有元素. e.g. HTML: <body> <div id="header&q…

CSS3 基础(1)——选择器详解

CSS3选择器详解一. 属性选择器在CSS3中,追加了三个属性选择器分别为:[att*=val].[att^=val]和[att$=val],使得属性选择器有了通配符的概念. 选择器示例描述 [attribute^=value] [src^="https"] 选择每一个src属性的值以"https"开头的元素 [attribute$=value] [src$=".pdf"] 选择每一个src属性的值以".pdf"结尾的…

Jquery 选择器详解 js 判断字符串是否包含另外一个字符串

Jquery 选择器详解在线文档地址:http://tool.oschina.net/apidocs/apidoc?api=jquery 各种在线工具地址:http://www.ostools.net/ 一.基本选择器 1 $("#div1").html("hello world 1"); //根据id匹配元素(a) 2 $(".c1").html("hello world 2"); //根据Yclass匹配元素(b)…

CSS系列(8) CSS后代选择器和子选择器详解

一.CSS后代选择器详解 1, 生动介绍基本概念一个标签嵌B在另一个标签A内部,B就是A的后代. 而且,B的后代也是A的后代,这就叫“子子孙孙无穷尽也”. 比如: <div> <p>这个p标签是div的后代</p> <div> 后代选择器就是用来选择一个标签的后代的: 两个选择器中间添加一个[空格]就构成了后代选择器,空格后面的那个是后代. 例如: div p { color : red; } 它会选择一堆的p标签,只要这个p标签是嵌套在某个div标签内…

web前端学习（三）css学习笔记部分（6）-- 选择器详解

9.选择器详解 9.1 属性选择器 CSS3 属性选择器,在 CSS3 中,追加了三个属性选择器分别为:[att*=val].[att^=val]和[att$=val],使得属性选择器有了通配符的概念. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style>…

web前端学习（三）css学习笔记部分（4）-- CSS选择器详解

4. 元素选择器详解 4.1 元素选择器 4.2 选择器分组用英文逗号","相连,使用相同的样式表使用通配符对所有元素进行通用设定. 4.3 类选择器详解 4.3.1. 类选择器允许以一种独立于文档元素的方式来指定样式 .class{} 4.3.2. 结合元素选择器 a.class{} (只指定a标签内的class类) <!DOCTYPE html> <html lang="en"> <head> <meta…

HTML5学习笔记（九）：选择器详解

在前面的笔记中我们已经接触过几种常见的选择器,本笔记我们将深入了解CSS的选择器. 元素选择器最常见的 CSS 选择器是元素选择器.换句话说,文档的元素就是最基本的选择器.在 W3C 标准中,元素选择器又称为类型选择器(type selector). 比如,下面的规则匹配文档树中所有 h1 元素: h1 {font-family: sans-serif;} 选择器分组假设希望 h2 元素和段落都有灰色.为达到这个目的,最容易的做法是使用以下声明: h2, p {color:gray;} 将…

css3 伪元素和伪类选择器详解

转自脚本之家:http://www.jb51.net/css/213779.html 无论是伪类还是伪元素,都属于CSS选择器的范畴.所以它们的定义可以在CSS标准的选择器章节找到.分别是 CSS2.1 Selectors 和 CSS Selector Level 3,两者都已经是推荐标准. 伪类选择器:CSS中已经定义好的选择器,不能随便取名常用的伪类选择器是使用在a元素上的几种,`如a:link|a:visited|a:hover|a:active` 提示:在 CSS 定义中,a:hove…

Qt样式表——选择器详解（父子关系）

在上一节中,小豆君给大家介绍了样式表的基本概念和大致用法.今天我们来详细了解下样式表中选择器的用法. 所谓选择器,就是指定你所设置的样式对哪个或哪些控件起作用. 到目前为止,Qt样式表支持CSS2中定义的所有选择器. 在讲解选择器之前,小豆君先来介绍下Qt对象树的一点概念,后面的分享会详细介绍. 例如下图,最外层的是QWidget,在QWidget上放置了QFrame,QFrame上又放置了QLabel和QComboBox.那么我们就为这些控件定义了家族关系,若QWidget为父亲,则QFram…

jQuery九类选择器详解

(1)基本选择器 <body> <div id="div1ID">div1</div> <div id="div2ID">div2</div> <span class="myClass">span</span> <p>p</p> <script type="text/javascript"> //1)查找ID…

CSS选择器详解

选择器是CSS的核心,从最初的元素.class/id选择器,演进到伪元素.伪类,以及CSS3中提供的更丰富的选择器,定位页面上的任意元素开始变得愈发的简单. 1.元素选择器这是最基本的CSS选择器,HTML文档中的元素本身就是一个选择器: p {line-height:1.5em; margin-bottom:1em;} 2.关系选择器 E F:后代选择器,该选择器定位元素E的后代中所有元素F: ul li {margin-bottom:0.5em;} E > F:子选择器,该选择器定位元素E…

CSS3中的伪类选择器详解

类选择器和伪类选择器区别类选择器我们可以随意起名,而伪类选择器是CSS中已经定义好的选择器,不可以随意起名. 伪类选择器以及伪元素我们把它放到这里 p.aaas{ text-align: left; color: red; } 它同样的会被选择最常见的伪类选择器未被访问的链接 a:link{ color: #ff6600 } /* 未被访问的链接 */ 我们来测试一下,我们给它添加一个超链接. 伪类选择器我们给这个伪类选择器,选定样式,第一种 a:link{ color: #000…

css3选择器详解

css中除了早先最早的,ID选择器,class选择器一些以外在css3中新加入了新的选择器,新选择器的使用大大的方便了我们的编程,下面我就说一些css3的选择器的使用方法, p 选择了所有<p>元素的标签; p{ background-color:yellow;}//所有p标签的背景色为黄色 div,p 这是选择了所有div和p元素标签: h1,p{ background-color:red;}//设置所有div中的h1和p的背景色为红色 div p 这个标签是选择div下…

CSS3 结构伪类选择器详解

1 CSS3 结构伪类选择器 1.E:root 匹配E元素所在的根元素即:html 2. E:nth-child(n) (1)匹配E元素的父元素中第n个子元素,(2)且该位置的子元素类型必须是E类型.否则无效 p:nth-child(1){color:red} <div> <p>这是红色的<p> </div> <div> <h1>这是第一个子元素但不是P类型,不是红色</h1> < p>这是黑色的注意对比…

jQuery-强大的jQuery选择器 (详解)[转]

1. 基础选择器 Basics 名称说明举例 #id 根据元素Id选择 $("divId") 选择ID为divId的元素 element 根据元素的名称选择, $("a") 选择所有<a>元素 .class 根据元素的css类选择 $(".bgRed") 选择所用CSS类为bgRed的元素 * 选择所有元素 $("*")选择页面所有元素 selector1, selector2, selectorN 可以将…

Jquery 选择器详解

在线文档地址:http://tool.oschina.net/apidocs/apidoc?api=jquery 各种在线工具地址:http://www.ostools.net/ 一.基本选择器 $("#div1").html("hello world 1"); //根据id匹配元素(a) $(".c1").html("hello world 2"); //根据Yclass匹配元素(b) $("span")…

[置顶] Jquery学习总结（二） jquery选择器详解

1.基本选择器 l ID 根据元素ID选择 l Elementname 根据元素名称选择 l Classname 根据元素css类名选择举例: <input type=”text” id=”ID” value=”根据ID选择”/> <a>根据元素名称选择</a> <input type=”text” class=”classname” value=”根据元素css类名选择”/> 取值: jQuery(“#ID”).val(); jQuery(“a”).te…

转--CSS选择器详解（一）常用选择器

今天复习一下CSS的知识,看了篇文章觉得很好,转来备用. 转自:http://www.cnblogs.com/fattydoit/p/3492028.html 目录类型选择器类选择器 ID选择器伪类伪元素类型选择器通过类型选择器可以选择某一类型的html标签,并对其使用样式. 语法: selector {property1: value; property2:value; ...} 示例: <html> <head> <style type="text/…

[CSS3] 学习笔记-选择器详解（三）

1.UI元素状态伪类选择器在CSS3的选择器中,除了结构性伪类选择器外,还有一种UI元素伪类选择器.这些选择器的共同特征是:指定的样式只有当元素处于某种状态时才起作用,在默认状态下不起作用.在CSS3中,共有17种UI元素伪类选择器,分别是: E:hover, E:active, E:focus, E:disabled, E:read-only, E:checked, E:default, E:indeterminate, E:selection, E:invalid, E: valid, E…

[CSS3] 学习笔记-选择器详解（二）

1.选择器first-child.last-child.nth-child和nth-last-child 利用first-child.last-child.nth-child和nth-last-child能够针对一个父元素中的第一个子元素.最后一个子元素.指定序号的子元素,甚至第偶数个或者第奇数个子元素进行样式的指定. <!doctype html> <html> <head> <meta charset="utf-8"> <tit…

[CSS3] 学习笔记-CSS3选择器详解（一）

1.属性选择器在CSS3中,追加了3个属性选择器,分别为:[att*=val].[att^=val]和[att$=val],使得属性选择器有了通配符的概念. <!doctype html> <html> <head> <meta charset="utf-8"> <title></title> <style> /*id包含div字符串,就加载效果*/ [id*=div]{ color:lime; }…

(18)0907_CSS选择器详解

选择器的优先级(决定那个样式生效): important: > 内联样式 > id选择器> 类和伪类 > 元素选择器 > 通配选择器> 继承样式无优先级最大 > 1000 > 100 > 10 > 1 > 0 > 无 (内联样式,也叫行内样式) 在 CSS 里面定义自增函数 counter-increment…

jQuery选择器详解

根据所获取页面中元素的不同.可以将jQuery选择器分为:四大类,其中过滤选择器在分为六小类 jQuery选择器基本选择器层次选择器过滤选择器简单过滤选择器内容过滤选择器可见性过滤选择器属性过滤选择器子元素过滤选择器表单对象属性过滤选择器表单选择器基本选择器是jQuery中使用最频繁的选择器,它是由元素Id,Class,元素名,多个选择符组成,通过基本选择器可以实现大多数页面元素的查找, 基本选择器选择器 …

jQuery的介绍和选择器详解

本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. jQuery 的介绍引入 jQuery 的原因在用 js 写代码时,会遇到一些问题: window.onload 事件有事件覆盖的问题,因此只能写一个事件. 代码容错性差. 浏览器兼容性问题. 书写很繁琐,代码量多. 代码很乱,各个页面到处都是. 动画效果很难实现. 如下图所示: jQuery的出现,可以解决以上问题. 什么是 jQuery jQuery 是 js…

[转]jQuery选择器 (详解)

1).基本 #id 根据给定的ID匹配一个元素.例如:$("#id")element 根据给定的元素名匹配所有元素.例如:$("div").class 根据给定的类匹配元素.例如:$(".style1"); * 匹配所有元素.例如:$("*")selector1,selector2,selectorN 将每一个选择器匹配到的元素合并后一起返回.例如:$("#id,div,.style1") 2).表单 :b…

jquery选择器之属性过滤选择器详解

代码如下: <style type="text/css"> /*高亮显示*/ .highlight{ } </style> 复制代码代码如下: <body> <div> <p>Hello</p> </div> <div id="test">ID为test的DIV</div> <input type="c…

CSS选择器详解（一）常用选择器

目录类型选择器类选择器 ID选择器伪类伪元素类型选择器通过类型选择器可以选择某一类型的html标签,并对其使用样式. 语法: selector {property1: value; property2:value; ...} 示例: <html> <head> <style type="text/css"> h1 { color:Red; font-size:30px;} </style> </head> <…

jQuery选择器详解及实例---《转载》

选择器是jQuery最基础的东西,本文中列举的选择器基本上囊括了所有的jQuery选择器,也许各位通过这篇文章能够加深对jQuery选择器的理解,它们本身用法就非常简单,我更希望的是它能够提升个人编写jQuery代码的效率.本文配合截图.代码和简单的概括对所有jQuery选择器进行了介绍,也列举出了一些需要注意和区分的地方. 一.基本选择器 1. id选择器(指定id元素) 将id="one"的元素背景色设置为黑色.(id选择器返单个元素) $(document).ready(func…

【CSS1，CSS2选择器详解】的更多相关文章