使用CSS选择器创建个性化链接样式（2）
作者：神采飞扬 来源：前端观察 发布时间：2009-06-02 13:07:00
2.定义个性化样式
现在我们来为各种类型的链接定义各自的样式，其实这个时候我们需要做的仅仅是定义不同的背景图片位置(background-position)：
mailto
mailto邮件链接是形如href=”mailto:abc@abc.com”的样式，它们的href属性的值以mailto开头，那么我们使用[att^=val]这种格式：
a[href^="mailto:"] {
background-position:right -242px;
}
word文档
我们一般认为，所有的doc文件链接都是href=”abc.doc”这种格式，也就是链接地址一.doc结束，那么我们需要使用[att$=val]这种格式。样式如下：
a[href$=".doc"] {
background-position:right -160px
}
PDF、excle、mp3等格式的文档也是通过这种方法来实现的。
包含qianduan.net字段的链接
对于包含某个字符串的链接，可以使用[att*=val]这种方式：
a[href*="qianduan.net"] {
background-position:right -328px
}
最后让我们看看完整的样式吧：
a {
background:url(a.gif) no-repeat right 4px;
padding-right:18px;color:#369;line-height:24px;
}
a[href^="mailto:"] {background-position:right -242px;}
a[href$=".doc"] {background-position:right -161px}
a[href$=".xls"] {background-position:right -282px}
a[href$=".pdf"] {background-position:right -79px}
a[href$=".mp3"] {background-position:right -204px}
a[href$=".swf"] {background-position:right -120px}
a[href$=".rar"] {background-position:right -38px}
a[href*="qianduan.net"] {background-position:right -328px}
而我们在使用的时候，也不需要添加额外的class：
<a href="abc.doc">Word文档</a>
仅此而已。
到这里，我们就完成了演示图片的所有样式
看看演示吧：
cssSelector_a.htm
0
投稿猜你喜欢
- 本文实例讲述了python实现堆栈与队列的方法。分享给大家供大家参考。具体分析如下：1、python实现堆栈，可先将Stack类写入文件st
Python递归函数实例1、打开Python开发工具IDLE,新建‘递归.py'文件，并写代码如下：def digui(n):if- 背景随着业务的发展，公司业务和规模不断扩大，网站积累了大量的用户信息和数据，对于一家互联网公司来说，用户和业务数据是根基。一旦公司的数据错乱
- 前言段（segment）是一种在数据库中消耗物理存储空间的任何实体（一个段可能存在于多个数据文件中，因为物理的数据文件是组成逻辑表空间的基本
- 今天的博客是直接来源于我自己的个人工具函数库。过去几个月，有些PyImageSearch读者电邮问我：“如何获取URL指向的图片并将其转换成
- 1. requests发送文件功能Requests 使得上传多部分编码文件变得很简单url = 'http://httpbin.or
- python是支持多线程的, 主要是通过thread和threading这两个模块来实现的，本文主要给大家分享python实现多线程网页爬虫
- 本文实例为大家分享了python实现UDP文件传输的具体代码，供大家参考，具体内容如下UDP协议下文件传输：服务端import socket
- 本文详细分析了Yii配置文件的用法。分享给大家供大家参考。具体分析如下：Yii配置文件比ThinkPHP复杂多了，先把自己了解的配置记录下来
- 本文实例讲述了Python发送邮件功能。分享给大家供大家参考，具体如下：这里以QQ邮箱为例说明登录邮箱点账号开启smtp开启时会要求你发送一
- 问题你想定义跟actor模式中类似“actors”角色的任务解决方案actor模式是一种最古老的也是最简单的并行和分布式计算解决方案。 事实
- Python的for循环十分灵活，使用for循环我们可以很轻松地遍历一个列表，例如：a_list = ['z', '
- 本文实例讲述了Python常见字符串操作函数。分享给大家供大家参考，具体如下：str.split(' ')1.按某一个字符分
- 前言MySQL慢查询日志是我们在日常工作中经常会遇到的一个功能，MySQL慢查询日志提供了超过指定时间阈值的查询信息，为性能优化提供了主要的
- HTML 5基本思维概念形成于2003年，之后W3C对页面超文本应用技术工作小组（WHATWG）开发的HTML草图颇感兴趣，这个小组的开发人
- 本文实例讲述了PHP封装的数据库模型Model类。分享给大家供大家参考，具体如下：<?php //引入配置文
- 本文实例讲述了Python基础之字符串常见操作。分享给大家供大家参考，具体如下：字符串基本操作切片# str[beg:end]# （下标从
- 今天记录一下如何使用python收发邮件，知识要点在python内置的poplib和stmplib模块的使用上。1. 准备工作首先，我们需要
- 本文研究的主要是python中协程的相关问题，具体介绍如下。Num01–>协程的定义协程，又称微线程，纤程。英文名Coroutine。
- 回复图片、音频、视频消息都是需要media_id的，这个是需要将多媒体文件上传到微信服务器才有的。将多媒体文件上传到微信服务器，以及从微信服
