1、实例源码 CSS3的[att^=val]选择器 [id^=div_border]{ background-color:#9F6; width:160px; font-family:微软雅黑; font-size:18px; font-size-adjust:!important; font-stretch:expanded; font-style:oblique; font-variant:inherit; font-weight:bolder; alignment-adjust:after-edge; alignment-baseline:alphabetic; marquee-speed:normal; } [id^=child]{ background-col...
一、子选择器 子选择器中前后部分之间用一个大于号隔开，前后两部分选择符在结构上属于父子关系。 子选择器是根据左侧选择符指定的父元素，然后在该父元素下寻找匹配右侧选择符的子元素。 二、简单例子 子选择器 这是个段落 这是超连接 @charset "utf-8";/* CSS Document *//*设置div下的p元素的样式*/div>p{ font-size:14px; color:#0000FF; }/*设置p元素下的a元素的样式*/p>a{ fo...
一、通用选择器 通用选择器可能是所有选择器中最强大的，却使用最少的。通用选择器的作用就像是通配符，它匹配所有可用元素。通用选择器由一个星号表示。通用选择器一般用来对象页面上所有元素应用样式 例如：可使用，以下规则删除第个元素上的默认的空白边界 *{margin:0;padding:0;} 二、分组选择器 分组选择器不是一种选择器类型，而是一种选择器使用方法。当多个对象定义了相同的样式时，就可以把它们分成...
一、相邻选择器 相邻选择器前后部分之间用一个加号（+）隔开，前后两部分选择反符在结构上属于同级关系，如 相邻选择器，是根据左侧选择符指定相邻元素，然后在该相邻元素后面寻找匹配匹配右侧选择符的相信元素 二、简单例子 相邻选择器/*选择中id为wrap最下的p标签使用相信选择器*/#sub_wrap + p{ font-size:22px; color:red; }标题2标题2下的段落标题2下的span相邻段落
一、包含选择器 包含选择器中前后两部分之间以空格隔开，根据左侧选择符指定的祖先元素，然后在该元素下寻找匹配右侧的选择侧符的下级元素 定义包含选择器时，必须保证在HTML结构中第一个对象能够包含第二个对象。 二、简单例子 包含/*定义类样式*/.div1{ font-size:14px; color:#FF0000; }/*定义类样式下的标题元素*/.div1 h1{ color:#FF00FF; }/*定义类样式下的span元素*/.div1 span{ color:#0...
一、指定选择器 有时个会希望控制某个元素在一定范围内的对象样式，这时就可以把元素与Class或者Id选择器结合起来使用 指定选择器span.red{ color:red;}div#top{ color:blue; }这是个SPAN类名为CLASS这是个SPAN这是个DIVID是TOP这是个DIV 指定选择器对象定义样式限定为class或者id属性的某种元素非常有用，它对元素的控制精度介于标签选择器与id或者类选择器之间，是一种非常实用的选择器类型 如下面模块中...
一：基本介绍 1：css版本 css1: 定义了网页的基本属性：字体，颜色，补白，基本选择器等等。 css2：添加了高级功能：浮动，定位，高级选择器（子选择器，相邻选择器，通用选择器） css3：遵循模块化开发。发布时间并不是一个时间点，而是时间段。（2002-至今） 2：css3新特性 （1）CSS选择器 （2）新的颜色制式和透明设定 （3）多栏布局的实现 （4）多背景图效果 （5）文字阴影效果 （6）开放的网络字体类...
last-of-type选择器 “:last-of-type”选择器和“:first-of-type”选择器功能是一样的，不同的是他选择是父元素下的某个类型的最后一个子元素。 示例演示 通过“:last-of-type”选择器，将容器“div.wrapper”中最后一个段落元素背景设置为橙色 （提示：这个段落不是“div.wrapper”容器的最后一个子元素）。 HTML代码： 我是第一个段落 我是第二个段落 我是第三个段落 我是第一个Div元...
说到伪选择器，真的让我体会到了CSS的无比强大，强大到自己貌似都不认识CSS了，有点C# 6.0中一些语法糖带给我们的震撼。。。首先 我们可以在VS里面提前预览一下。 可以看到，上面的伪类有很多很多，多的让我眼都快瞎了。。。下面就挑一些实用性比较强的说一说。 一 :nth-child 伪选择器 我们知道在jquery中有一种选择器叫做“子类选择器”，对应的有:nth-child，:first-child，:last-child，:only-child，这回...
上篇我们说了为什么要使用css，这篇我们就从选择器说起，大家都知道浏览器会把远端过来的html解析成dom模型，有了dom模型，html就变成 了xml格式，否则的话就是一堆“杂乱无章”的string，这样的话没人知道是什么鸟东西，js也无法什么各种getElementById，所以当浏览器解析成dom 结构后，浏览器才会很方便的根据css各种规则的选择器在dom结构中找到相应的位置，那下一个问题自然就严重了，那就是必须深入的理解dom模型。 ...
//demo.js 调用 window.onload = function () { // $().getClass("a").css("color","red");//旧方法 /* $("#box").css("color", "red").click(function(){ alert($(this).html()) });*/ //$(".a").css("color","green") // $("p").find(".a").css("color","blue"); $("div").find("span").css("color","red") // $("div").find(".a").css("color","red"); //$("div").find("#bb").css("colo...
我们都知道css有3种基本设置方式即 1、行内也叫嵌入式 例如： 2、内联式，在html文件中用style标签包裹着的 例如： div{ background:red; } 3、链接式，在html文件中用link标签引用进来着的 例如： 注：还有一种@import写法不太常用兼容性也有问题忽略了 当我们同时使用这三种方式来对同一目标元素设置样式的时候优先级是 行内>内联>链接 一般情况...
[译]XPath和CSS选择器 原文:http://ejohn.org/blog/xpath-css-selectors 最近,我做了很多工作来实现一个同时支持XPath和CSS 3的解析器,令我惊讶的是:它们俩在某些方面上非常相似,而在另一些方面上又完全不同.不同的地方有,CSS是用来配合HTML工作的,可以使用#id来根据ID获取元素,以及使用.class来根据class获取元素.这些用XPath实现的话都不会那么简洁,反过来呢,XPath可以使用..来返回到DOM树的上层节点中,还可以使用foo[bar]来获...
[attribute] 用于选取带有指定属性的元素。 [attribute=value] 用于选取带有指定属性和值的元素。 [attribute~=value] 用于选取属性值中包含指定词汇的元素。 [attribute|=value] 用于选取带有以指定值开头的属性值的元素，该值必须是整个单词。 [attribute^=value] 匹配属性值以指定值开头的每个元素。 [attribute$=value] 匹配属性值以指定值结尾的每个元素。 [attribute*=value] 匹配属...
css笔记-选择器详解 CSS通过选择器来定位要应用样式的元素。 下面对所有的选择器做了一个解释（CSS为版本号）。 CSS选择器详解 选择器 例子 例子描述 CSS .class .intro 选择 class="intro" 的所有元素。 1 #id #firstname id="firstname" 的所有元素。 1 * * 选择所有元素。 2 element p 选择所有...