30个最常用css选择器解析(3)
作者:iiduce 发布时间:2011-06-16 20:36:37
标签:css选择器,css,浏览器
10. X[title]
a[title] {
color: green;
}
属性选择器。比如上述代码匹配的是带有title属性的链接元素。
兼容浏览器:IE7+、Firefox、Chrome、Safari、Opera
11. X[title="foo"]
a[href="http://css9.net"] {
color: #1f6053;
}
属性选择器。 上面的代码匹配所有拥有href属性,且href为http://css9.net的所有链接。
这个功能很好,但是多少又有些局限。如果我们希望匹配href包含css9.net的所有链接该怎么做呢?看下一个选择器。
兼容浏览器:IE7+、Firefox、Chrome、Safari、Opera
12. X[title*="css9.net"]
a[href*="css9.net"] {
color: #1f6053;
}
属性选择器。正如我们想要的,上面代码匹配的是href中包含"css9.net"的所有链接。
兼容浏览器:IE7+、Firefox、Chrome、Safari、Opera
13. X[href^="http"]
a[href^="http"] {
background: url(path/to/external/icon.png) no-repeat;
padding-left: 10px;
}
属性选择器。上面代码匹配的是href中所有以http开头的链接。
兼容浏览器:IE7+、Firefox、Chrome、Safari、Opera
13. X[href$=".jpg"]
a[href^="http"] {
background: url(path/to/external/icon.png) no-repeat;
padding-left: 10px;
}
属性选择器。在属性选择器中使用$,用于匹配结尾为特定字符串的元素。在上面代码中匹配的是所有链接到扩展名为.jpg图片的链接。(注意,这里仅仅是.jpg图片,如果要作用于所有图片链接该怎么做呢,看下一个选择器。)
兼容浏览器:IE7+、Firefox、Chrome、Safari、Opera
0
投稿
猜你喜欢
- 在HTML中,常见的URL有多种表示方式:相对URL: example.php demo
- 对于SQL的新手,NULL值的概念常常会造成混淆,他们常认为NULL是与空字符串''相同的事。情况并非如此。例如,下述语句是
- 写好脚本,注册好服务之后,经测试,ORACLE可以随RHEL启动而启动,但不能随系统关闭而关闭。在网上找答案,发现几乎所有的设置过程帖子都是
- 译文原文:http://blog.benhuoer.com/2009/04/10-simple-and-impressive-design-
- px比em更加容易使用,em指字体高,任意浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=16px,所以10px=0.
- 直接看代码: 代码如下:Class GoogleTranslator sub Class_Initialize
- 想做个和IBM公司一样的网站LOGO,试了半天也没有做出来,郁闷之下,只好求高手帮助!先在这里谢谢了!方法一1、写上IBM,调节字号颜色2、
- 概 述 ---- 现在有不少介绍利用ASP实现动态分页的文章,方法大同小异,就是每次利用ADO返回原始
- 在了解了JavaScript1.7的相关更新后,我们再继续关注JavaScript1.8的新特性。在W3C Group带来的JavaScri
- <%'***********************************************'函数
- 可视性的问题几乎在每次不同产品的用户测试中都会出现:用户总是对页面的某些元素、功能视若无睹,或根本无视。基于此,对这个问题进行了一番小小的研
- 昨天还和裕波沟通我没有准备ppt,想以另一种互动的方式来交流。后来想想,每个人都准备了,我不准备也不太好意思,呵呵。今天在webrebuil
- 代码如下:<% sql="select * from serr where
- 现在很多以内容为核心的网站上都在文章底部添加了社会化分享按钮,能让浏览用户在发现一篇有价值的文章时,可以通过社会化网络快速分享给自己的好友,
- 这个项目到一开始的kickoff到现在,持续了很长的一段时间,现在差不多也接近了尾声,所以要好好做个总结,下面不会设计到太多技术层面上的东西
- 在oracle中有很多关于日期的函数,如:1、add_months()用于从一个日期值增加或减少一些月份 date_value:=add_m
- 一个Javascript 的类库,用于table内容排序。使用很方便,不用每次都去调用数据库了。特别适合多表查询的排序。加上<tbod
- position属性可以让你让你随意控制一个特定元素在浏览器何处以及如何显示。比方说我们用position:fixed 让一个图片显示在浏览
- 可能不少学习javascript在使用call,apply,callee时会感到困惑,以下希望对于你有所帮助:1、它是函数的方法或属性;2、
- 做程序开发的人都知道版本控制的重要性, 代码的管理好说,TFS/SVN/VSS/CVS,哪个都能用。但涉及到数据库的版本控制,就不是太好做的