关于css的一些技巧

一、IE5.5和更高版本提供了一些专有的CSS,可以实现PNG透明度：
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/mask.png',sizingMethod='crop');

二、突出显示不同类型的链接：

1、让css自动判断链接是否外部链接，并作出标注，让使用者自己选择如果使用这些链接：

a[href^="http:"] {
background: url(images/externalLink.gif) no-repeat right top;
padding-right: 10px;
}

a[href^="http://www.yoursite.com"], a[href^="http://yoursite.com"] {
background-image: none;
padding-right: 0;
}

2、对邮件链接进行突出显示：

a[href^="mailto:"] {
background: url(images/email.png) no-repeat right top;
padding-right: 15px;
}

3、对非标准的协议，如即时消息协议：

a[href^="aim:"] {
background: url(images/im.png) no-repeat right top;
padding-right: 15px;
}

<a href="aim:goim?screenname=andybudd">instant message</a>

如图显示：



三、突出显示可下载的文档和提要：

链接为特定的文件格式，如doc或pdf，可使用如下方式表示出来

a[href$=".pdf"] {

background:url(image/pdfLink.gif) no-repeat right top;

padding-right:10px;

}

a[href$=".doc"] {

background:url(image/wordLink.gif) no-repeat right top;

padding-right:10px;

}

采用前面的方法，可以用不同的图标突出显示Word文档和PDF，告诉访问者他们是下载而不是另一个页面的链接。

还可以用这种方法突出表现RSS提要：

a[href$=".rss"], a[href$=".rdf"]{

background:url(image/wordLink.gif) no-repeat right top;

padding-right:10px;

}

但是IE6和耕地的版本不支持属性选择器，我们可以呕吐能够国在每个元素中添加类，使用JavaScript和DOM实现相似的效果，最好的方法之一是使用getElementBySelector函数，在http://tinyurl.com/dmao4上可以找到更多细节。