CSS3实战之新增的选择器
用的比较少 看到知道怎么回事就ok
http://www.w3.org/TR/css3-selectors/#selectors
http://www.cnblogs.com/jscode/archive/2012/07/30/2615748.html
新增选择器列表:
E[foo^="bar"]:匹配foo属性值以"bar"开始的E元素
E[foo$="bar"]:匹配foo属性值以"bar"结束的E元素
E[foo*="bar"]:匹配foo属性值包含"bar"的E元素
这几个选择器很简单,其实在jQuery的选择器中早就包含了,所以就不多说了。
浏览器兼容性:
![]() |
![]() |
![]() |
![]() |
![]() |
|
|
|
|
|
连IE7、8都提供了支持,IE6正逐渐被淘汰,所以放心地用吧。
结构伪类选择器
新增结构伪类选择器列表:
E:root:匹配E所在文档的根元素
E:nth-child(n):匹配元素类型为E且是父元素的第n个子元素
E:nth-last-child(n):匹配元素类型为E且是父元素的倒数第n个子元素(与上一项顺序相反)
E:nth-of-type(n):匹配父元素的第n个类型为E的子元素
E:nth-last-of-type(n):匹配父元素的倒数第n个类型为E的子元素(与上一项顺序相反)
E:first-of-type:匹配父元素的第一个类型为E的子元素
E:last-child:匹配元素类型为E且是父元素的最后一个子元素
E:last-of-type:匹配父元素的最后一个类型为E的子元素
E:only-child:匹配元素类型为E且是父元素中唯一的子元素
E:only-of-type:匹配父元素中唯一子元素是E的子元素
E:empty:匹配不包含子节点(包括文本)的E元素
CSS3实战之新增的选择器的更多相关文章
- CSS3新增的选择器和属性
<!doctype html>无标题文档 一.新增的选择器 CSS3新增的属性选择器 {除ie6外的大部分浏览器支持) 序号 选择器 含义 实例 1 E[att^="val&qu ...
- 《css3实战》读书笔记 第一章 基于CSS需求而编写的HTML.
笔记说明 <CSS3实战手册第3版(影印版)>可以消除Web设计工作的痛苦,并且带给你:HTML--重新入门.如果你是HTML新手,你会学到如何以CSS友好的方式进行基本页面构造.若你是H ...
- CSS3实战开发 表单发光特效实战开发
首先,我们先准备好html代码: <!doctype html> <html> <head> <meta charset="utf-8"& ...
- CSS3每日一练之选择器-结构性伪类选择器
<!DOCTYPE HTML> <html> <head> <meta charset="gb2312"> <title> ...
- CSS3实战手册(第3版)(影印版)
<CSS3实战手册(第3版)(影印版)> 基本信息 原书名:CSS3: The Missing Manual, 3E 作者: David Sawyer McFarland 出版社:东南大学 ...
- CSS3实战开发:使用CSS3实现photoshop的过滤效果
原文:CSS3实战开发:使用CSS3实现photoshop的过滤效果 我们知道,使用Photoshop来调整图像的亮度和对比度,或者将图片转化为灰度等等是很常见的功能.今天我将给大家介绍几个新特性,我 ...
- CSS3实战开发: 纯CSS实现图片过滤分类显示特效
原文:CSS3实战开发: 纯CSS实现图片过滤分类显示特效 各位网友大家好,今天我要带领大家开发一个纯CSS的图片分类显示的网址导航,单纯看标题大家可能有些困惑,依照以往惯例,我先给大家演示一下实际运 ...
- CSS3实战开发: 折角效果实战开发
<!DOCTYPE html> <html> <head> <meta charset="utf-9"> <meta name ...
- Selectivizr-让IE6~8支持CSS3伪类和属性选择器
一.下载和demo 下载: 您可以狠狠地点击这里:selectivizr-1.0.0.zip(右键-[目标|链接另存为] 9.24K) demo: 您可以狠狠地点击这里:Selectivizr部分属性 ...
随机推荐
- 剑指Offer16 判断子树
/************************************************************************* > File Name: 17_Mirror ...
- Codeforces Round #197 (Div. 2) C,D两题
开了个小号做,C题一开始看错范围,D题看了半小时才看懂,居然也升到了div1,囧. C - Xenia and Weights 给出一串字符串,第i位如果是1的话,表示有重量为i的砝码,如果有该种砝码 ...
- 用jquery 实现 超出字符 截断加上省略号并且可以提示全部内容
1.test.jsp Java代码 <%@ page language="java" pageEncoding="UTF-8"%> <html ...
- Bootstrap,导航栏点击效果修复(补)
前言: 昨天晚上休息,忘记发博客了.对于学习这件是,还是需要坚持的.想想自建一个Jekyll博客模版还是很兴奋的,话不多说,看正文吧! 关于开发: 先看个Demo吧,点这里.你会发现,点击是没有效果 ...
- ASP.NET MVC 教程
http://msdn.microsoft.com/zh-cn/dd327597.aspx
- C# 输出24小时格式时间
比如 MessageBox.Show(DateTime.Now.ToString("yyyy-MM-dd hh:mm:ss")); 会输出 2014-4-3 5:08:4[1 ...
- eBay 开发流程
1[记录]注册成为eBay开发者(eBay Developers Program)+创建Sanbox Key和Production Key http://www.crifan.com/register ...
- [老老实实学WCF] 第四篇 初探通信--ChannelFactory
老老实实学WCF 第四篇 初探通信--ChannelFactory 通过前几篇的学习,我们简单了解了WCF的服务端-客户端模型,可以建立一个简单的WCF通信程序,并且可以把我们的服务寄宿在IIS中了. ...
- fread 和 fwrite 函数用法示例以及注意事项
1.函数功能 用来读写一个数据块. 2.一般调用形式 fread(buffer,size,count,fp); fwrite(buffer,size,count,fp); 3.说明 ( ...
- nyoj_t218(Dinner)
描述 Little A is one member of ACM team. He had just won the gold in World Final. To celebrate, he dec ...