第7章征服CSS3选择器（下）

:enabled选择器在Web的表单中,有些表单元素有可用(":enabled")和不可用(":disabled")状态,比如输入框,密码框,复选框等.在默认情况之下,这些表单元素都处在可用状态.那么我们可以通过伪选择器":enabled"对这些表单元素设置样式. 示例演示通过":enabled"选择器,修改文本输入框的边框为2像素的红色边框,并设置它的背景为灰色. :disabled选择器 ":disabled…

第6章征服CSS3选择器（上）

属性选择器在HTML中,通过各种各样的属性可以给元素增加很多附加的信息.例如,通过id属性可以将不同div元素进行区分. 在CSS2中引入了一些属性选择器,而CSS3在CSS2的基础上对属性选择器进行了扩展,新增了3个属性选择器,使得属性选择器有了通配符的概念,这三个属性选择器与CSS2的属性选择器共同构成了CSS功能强大的属性选择器.如下表所示: 实例展示: html代码: <a href="xxx.pdf">我链接的是PDF文件</a> <a hre…

css3基础教程十三征服CSS3选择器

:enabled选择器在Web的表单中,有些表单元素有可用(“:enabled”)和不可用(“:disabled”)状态,比如输入框,密码框,复选框等.在默认情况之下,这些表单元素都处在可用状态.那么我们可以通过伪选择器“:enabled”对这些表单元素设置样式. 示例演示通过“:enabled”选择器,修改文本输入框的边框为2像素的红色边框,并设置它的背景为灰色. HTML代码: <form action="#"> <div> <labe…

CSS3 选择器——伪类选择器

前面花了两节内容分别在<CSS3选择器——基本选择器>和<CSS3选择器——属性选择器>介绍了CSS3选择器中的基本选择器和属性选择器使用方法,今天要和大家一起学习CSS3选择器中的第三部分,也是最后一部分——伪类选择器.伪类选择器对于大家来说最熟悉的莫过于:link,:focus,:hover之类的了,因为这些在平时中是常用到的伪类选择器,那么先和大家一起简单总结一下CSS中常用的伪类选择器的使用方法,最后把重心放到CSS3新增加的":nth-child"选择…

CSS3选择器（三）之伪类选择器

伪类选择器对于大家来说最熟悉的莫过于:link,:focus,:hover之类的了,因为这些在平时中是常用到的伪类选择器,那么先和大家一起简单总结一下CSS中常用的伪类选择器的使用方法,最后把重心放到CSS3新增加的":nth-child"选择器的使用方法. CSS的伪类语法和别的语法有点不一样,其主要有两种语法表达方式. 第一种写法 E:pseudo-class {property:value}/*其中E为元素;pseudo-class为伪类名称;property是css的属性;v…

css3: css3选择器

--------------------css3选择器-------------------------css3属性选择器 ~~属性选择器基本上ie7+都支持,可以相对放心的使用见: www.caniuse.com[attr][attr=value][attr*=value] //css3[attr^=value] //css3[attr$=value] //css3[attr~=value] ~~ [title~="foo2"] 匹配 <a title="fo…

总结30个CSS3选择器

或许大家平时总是在用的选择器都是:#id .class 以及标签选择器.可是这些还远远不够,为了在开发中更加得心应手,本文总结了30个CSS3选择器,希望对大家有所帮助. 1 *:通用选择器 ;; } *选择器是选择页面上的全部元素,上面的代码作用是把全部元素的margin和padding设为0,最基本的清除浏览器默认样式的方法.*选择器也可以应用到子选择器中,例如下面的代码: #container * { border:1px solid black; } 这样ID为container 的…

总结30个CSS3选择器（转载）

或许大家平时总是在用的选择器都是:#id .class 以及标签选择器.可是这些还远远不够,为了在开发中更加得心应手,本文总结了30个CSS3选择器,希望对大家有所帮助. 1 *:通用选择器 * { margin:0; padding:0; } *选择器是选择页面上的全部元素,上面的代码作用是把全部元素的margin和padding设为0,最基本的清除浏览器默认样式的方法. *选择器也可以应用到子选择器中,例如下面的代码: #container * { border:1px solid bl…

CSS3 选择器——属性选择器

上一节在<CSS3选择器——基本选择器>中主要介绍了CSS3选择器的第一部分,这节主要和大家一起来学习CSS3选择器的第二部分——属性选择器.属性选择器早在CSS2中就被引入了,其主要作用就是对带有指定属性的HTML 元素设置样式.使用CSS3属性选择器,你可以只指定元素的某个属性,或者你还可以同时指定元素的某个属性和其对应的属性值. 从上一节展示的CSS3选择器的图表中,我们可以知道,CSS3的属性选择器主要包括以下几种: E[attr]:只使用属性名,但没有确定任何属性值: E[attr=…

CSS3选择器介绍

1.css3属性选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>css3属性选择器</title> <style type="text/css"> /* id包含div字符串*/ [id*=div] { color: lime; } /*开始字符串为div*/ [i…

CSS3 选择器——基本选择器

CSS的选择器,我想大家并不会陌生吧,因为天天在使用,但对于CSS3的选择器,要运用的灵活到位,我想对很多朋友还是一定的难度,特别是CSS3中的:nth选择器.那么从现在开始我们先丢开他们版本的区别,从头一起来看看CSS选择器的运用. CSS是一种用于屏幕上渲染html,xml等一种语言,CSS主要是在相应的元素中应用样式,来渲染相对应用的元素,那么这样我们选择相应的元素就很重要了,如何选择对应的元素,此时就需要我们所说的选择器.选择器主要是用来确定html的树形结构中的DOM元素节点.我把C…

css3选择器（一）

直接开始正文. 一.css3同级元素通用选择器[update20161228] 选择器:E~F 匹配任何在E元素之后的同级F元素 Note:E~F选择器选中的是E元素后面同级元素中的全部F元素. 例:2个导航之间加个竖杠的效果,可以用li~li选择器,在li后面同级的li的前面加个竖杠. li~li:before{ /*E~F:css3选择器,匹配任何在E元素之后的同级F元素*/ content: "|"; color: red; padding-right: 5px; } 二.属性选…

css3 选择器（二）

接css3选择器(一) 八.结构性伪类选择器[:nth-child(n)] :nth-child(n)选择器用来匹配某个父元素的一个或多个特定的子元素,和jquery中一样. 其中"n"是其参数,而且可以是整数值(1,2,3,4),也可以是表达式(2n+1,-n+5)和关键字(odd[奇数].even[偶数]),但是参数n的值起始值始终是1,而不是0.也就是说,参数n的值为0时,选择器将选择不到任何匹配的元素. Note:当“:nth-child(n)”选择器中的n为一个表达式时,其中…

[css3]CSS3选择器:nth-child和:nth-of-type之间的差异

by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1709 一.深呼吸,直接内容 :nth-child和:nth-of-type都是CSS3中的伪类选择器,其作用近似却又不完全一样,对于不熟悉的人对其可能不是很区分,本文就将介绍两者的不同,以便于大家正确灵活使用这两类选择器. 先看一个简单的实例,首先是HTML部分: <section> <p>我是第1个p标…

CSS3选择器（一）之基本选择器

CSS的选择器,我想大家并不会陌生吧,因为天天在使用,但对于CSS3的选择器,要运用的灵活到位,我想对很多朋友还是一定的难度,特别是CSS3中的:nth选择器.那么从现在开始我们先丢开他们版本的区别,从头一起来看看CSS选择器的运用. CSS 是一种用于屏幕上渲染html,xml等一种语言,CSS主要是在相应的元素中应用样式,来渲染相对应用的元素,那么这样我们选择相应的元素就很重要了, 如何选择对应的元素,此时就需要我们所说的选择器.选择器主要是用来确定html的树形结构中的DOM元素节点.我把…

前端必须掌握30个CSS3选择器

也许你已经学会了CSS的三个简单常用的选择器:#ID,.class,标签选择器,可是这些就足够了吗?随着CSS3的到来,作为前端开发者需要掌握下面三十个基本的选择器,这样才可以在平时开发中得心用手. 本文中将综合前端开发中常用的30个CSS3选择器,并且附带了浏览器的支持情况,希望对大家有所帮助. 1.*:通用元素选择器 * { margin: 0; padding: 0; } *选择器是选择页面上的全部元素,上面的代码作用是把全部元素的margin和padding设为0,最基本的清除默认CSS…

CSS3选择器:nth-child和:nth-of-type之间的差异

CSS3选择器:nth-child和:nth-of-type之间的差异这篇文章发布于 2011年06月21日,星期二,23:04,归类于 css相关. 阅读 57546 次, 今日 143 次 by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1709 一.深呼吸,直接内容 :nth-child和:nth-of-type都是CSS3中的伪类选择器,其作用近似却又不完全一…

神奇的CSS3选择器

话说园子里也混迹多年了,但是基本没写过blog,写点基础的,那就从css3选择器开始吧. Css3选择器先说下,为什么提倡使用选择器. 使用选择器可以将样式与元素直接绑定起来,在样式表中什么样式与什么元素匹配一目了然,修改起来也很方便. 减少样式表的代码量. 属性选择器 1.[att*=val]属性选择器意义:表示元素用att表示的属性的属性值包含用val表示的字符,则该元素使用这个样式 <!DOCTYPE html> <html lang="en"> &l…

css3 选择器记

css3 选择器根据所获取页面中元素的不同,把css3选择器分为五大类: 基本选择器层次选择器伪类选择器动态伪类选择器目标伪类选择器语言伪类选择器 UI元素状态伪类选择器结构伪类选择器否定伪类选择器伪元素属性选择器基本选择器基本选择器是CSS中使用最频繁,最基础,也是CSS中最早定义的选择器.通过基本选择器可以确定HTML树形结构中大多素DOM元素节点. 通配选择器通配选择器(*)用来选择所有元素,当然也可以选择某个元素下的所有元素. *{ margin:0; padd…

CSS3选择器使用小结

CSS3 选择器小结一通用选择器 1 *{}通配选择符(CSS2):适合所有元素对象. 2 E类型(HTML)选择符(CSS1):以文档语言对象类型DOM作为选择符. 3 E#myid是id选择符(CSS1):以唯一标识符id属性等于myid的E对象作为选择符. 4 E.myclass是类class选择符(CSS1):以class属性包含myclass的E对象作为选择符. 5 E F:包含选择符(CSS1):选择所有被E元素包含的F元素. CSS3新增的通用选择器:同级元素通用选择…

CSS3选择器小结

CSS3知识点整理（二）----CSS3选择器

总结各种CSS3选择器的介绍及具体语法 (一)属性选择器在CSS2中引入了一些属性选择器,而CSS3在CSS2的基础上对属性选择器进行了扩展,新增了3个属性选择器,使得属性选择器有了通配符的概念,这三个属性选择器与CSS2的属性选择器共同构成了CSS功能强大的属性选择器.如下表所示: html代码: <a href="xxx.pdf">我链接的是PDF文件</a> <a href="#" class="icon"&…

css3常用方法以及css3选择器

最重要的 CSS3 模块包括: 选择器框模型背景和边框文本效果 2D/3D 转换动画多列布局用户界面 CSS3 边框 CSS3 边框通过 CSS3,您能够创建圆角边框,向矩形添加阴影,使用图片来绘制边框 - 并且不需使用设计软件,比如 PhotoShop. border-radius box-shadow border-image CSS3 圆角边框在 CSS2 中添加圆角矩形需要技巧.我们必须为每个圆角使用不同的图片. 在 CSS3 中,创建圆角是非常容易的.…

第二章（jQuery选择器）

2.1jQuery选择器是什么 1.CSS选择器选择器示例选择器示例标签选择器 a{ } p{ } ul{ } ID选择器 #ID{ } 类选择器 .class{ } 群组选择器 td,p,div,a{ } 后代选择器 #link a{ } 通配符选择器 *{ } 2.jQuery选择器 *jQuery的行为规则都必须再获取到元素后才能生效例: <script type="text/javascript"> function demo(){ Alert('Jav…

30个CSS3选择器的应用

或许大家平时总是在用的选择器都是: id class 以及标签选择器.可是这些还远远不够,为了在开发中更加得心应手,本文总结了30个CSS3选或许大家平时总是在用的选择器都是:#id .class 以及标签选择器.可是这些还远远不够,爱创课堂为了在开发中更加得心应手,本文总结了30个CSS3选择器,希望对大家有所帮助. 更多精彩关注:http://www.icketang.com/ 1 *:通用选择器 * { margin:0; padding:0; } *选择器是选择页面上的全部元素,上…

第四章初始CSS3预习笔记

第四章初始CSS3预习笔记一: 1: 什么是CSS? 全称是层叠样式表;/通常又称为风格样式表,.他是用来进行网页风格设计的; 2:CSS的优势: 1>内容以表现分离,即使用u前面学习的HTML语言制作网页 ,使用CSS设置网页样式,风格,并且css样式单独存在一个文件夹里..这样.HTML文件`引用的css文件就可以了网页的内容与表现就可以分离了,便于后期css的使用 ; 2>表现的统一; 3>丰富的样式 ,使得页面布局更加灵活. 4>减少网页的代码量,提高网页的浏览速度…

H5 21-属性选择器下

21-属性选择器下 --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>21-属性选择器下</title> <style> /* img[alt^=abc]{ color: red; } */ /* img[alt|=abc]{ color: red; } img[alt$=abc]…

CSS3 选择器基本选择器介绍

CSS是一种用于屏幕上渲染html,xml等一种语言,CSS主要是在相应的元素中应用样式,来渲染相对应用的元素,那么这样我们选择相应的元素就很重要了,如何选择对应的元素,此时就需要我们所说的选择器.选择器主要是用来确定html的树形结构中的DOM元素节点.我把CSS选择器分开成三部分,第一部分是我们常用的部分,我把他叫做基本选择器:第二部分我把他称作是属性选择器,第三部分我把他称作伪类选择器,这一部分也是最难理解和掌握的部分,今天我们先来看第一部分——基本选择器.我们先来看一个常用的选择器列表图…

CSS3选择器:nth-child和:nth-of-type之间的差异——张鑫旭

一.深呼吸,直接内容 :nth-child和:nth-of-type都是CSS3中的伪类选择器,其作用近似却又不完全一样,对于不熟悉的人对其可能不是很区分,本文就将介绍两者的不同,以便于大家正确灵活使用这两类选择器. 先看一个简单的实例,首先是HTML部分: <section> <p>我是第1个p标签</p> <p>我是第2个p标签</p>  </section> 然后两个选择器相对应的CSS…

一种基于匹配回朔的 css3 选择器引擎实现

介绍 CSS 选择器是一种应用于 DOM 节点查找场景的特定微型语法, 本质上和正则表达式一样都是一种模式匹配语言,灵活使用可以方便得获取指定位置的节点集合. 目前 W3C 推荐标准为 Selectors Level 3 , 在 ie9+ 以及 firefox,chrome,mobile 等浏览器上原生有基本一致的实现,而在 ie 下则需要使用 javascript 模拟实现,本文介绍一种基于匹配回朔的 css3 选择器引擎实现,特定应用于 ie6,7,8 下. 语法 css 选择器是一种紧凑…

【第7章 征服CSS3选择器（下）】的更多相关文章

【第7章征服CSS3选择器（下）】的更多相关文章