属性选择器合集
<!doctpye html>
<html>
<head>
<meta charset="utf-8">
<title>选择器</title>
<style type="text/css">
p{
margin:4px;
}
a[href^="http:"]{
background:url(imags/window.gif) no-repeat left center;
padding-left:18px;
}
a[href$="pdf"]{
background:url(images/icon_pdf.gif) no-repeat left center;
padding-left:18px;
}
a[href$="xls"]{
background:url(images/icon_xls.gif) no-repeat left center;
padding-left:18px;
}
a[href$="ppt"]{
background:url(images/icon_ppt.gif) no-repeat left center;
padding-left:18px;
}
a[href$="rar"]{
background:url(images/icon_rar.gif) no-repeat left center;
padding-left:18px;
}
a[href$="gif"]{
background:url(images/icon_img.gif) no-repeat left center;
padding-left:18px;
}
a[href$="jpg"]{
background:url(images/icon_img.gif) no-repeat left center;
padding-left:18px;
}
a[href$="png"]{
background:url(images/icon_img.gif) no-repeat left center;
padding-left:18px;
}
a[href$="txt"]{
background:url(images/icon_txt.gif) no-repeat left center;
padding-left:18px;
}
</style>
</head>
<body>
<p><a href="http://www.baidu.com/name.pdf">PDF 文件</a></p>
<p><a href="http://www.baidu.com/name.ppt">PPT 文件</a></p>
<p><a href="http://www.baidu.com/name.xls">XLS 文件</a></p>
<p><a href="http://www.baidu.com/name.rar">RAR 文件</a></p>
<p><a href="http://www.baidu.com/name.gif">GIF 文件</a></p>
<p><a href="http://www.baidu.com/name.jpg">JPG 文件</a></p>
<p><a href="http://www.baidu.com/name.png">PNG 文件</a></p>
<p><a href="http://www.baidu.com/name.txt">TXT 文件</a></p>
<p><a href="http://www.baidu.com/#anchor">#锚点超链接</a></p>
<p><a href="http://www.baidu.com/">http://www.baidu.com/</a></p>
</body>
</html>本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2022-11-13，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
腾讯云开发者
