PDF文件可能携带病毒，因其广泛使用且易嵌入恶意代码、链接或脚本，常被用于钓鱼攻击；需通过加密、数字签名、权限控制及警惕陌生附件等方式防范。
为什么[href$=".pdf"]比[href*=".pdf"]更安全
用 [href*=".pdf"] 会匹配到 https://example.com/pdf-report.html 这类根本不是 PDF 的链接，因为 * 表示“包含”，只要字符串里有 .pdf 就中招。而 [href$=".pdf"] 是严格结尾匹配，只认准 href 值以 .pdf 结尾的链接——哪怕后面带查询参数（如 report.pdf?ver=2）也照样生效。
常见踩坑点：
- 漏掉点号写成
[href$="pdf"]，结果myappdf也被匹配 - 用了空格或引号不一致，比如
[href$= '.pdf']（前面多空格）或[href$='.PDF']（大小写敏感，默认不匹配.Pdf） - 没加
i标志，导致REPORT.PDF或doc.PDF被忽略
怎么让 PDF 图标稳定对齐文字
直接用 background-image + padding-left 最省事，但容易在换行、缩放或高 DPI 下错位。核心是控制图标的渲染上下文：
- 必须设
display: inline-block或inline-flex，否则background-position在内联元素中行为不可控 -
background-size: 16px比1em更稳，避免字体缩放时图标失真 - 用 data URL 内嵌 SVG（如
url("data:image/svg+xml,%3Csvg...%3E")），彻底规避跨域和路径问题 - 加
background-repeat: no-repeat和background-position: left center，确保图标始终贴左垂直居中
PDF 链接带查询参数或锚点时还生效吗
生效。只要 .pdf 出现在 href 字符串的末尾位置之前（即紧挨着 ?、# 或字符串终点），$= 就能命中。例如：
立即学习“前端免费学习笔记（深入）”；
-
guide.pdf✅ -
guide.pdf?download=1✅（.pdf确实在?前结束） -
guide.pdf#section1✅ -
guide.pdf?v=1&src=main✅（注意 HTML 中 & 是转义后的 &） -
guide.pdf/❌（结尾是/，不是.pdf）
如果你发现某些链接没匹配上，用浏览器开发者工具检查实际渲染的 href 属性值——有时 JS 动态改过 href，或服务端重写了 URL，真实值可能和源码不一致。
本地开发时图标不显示，可能卡在哪
本地用 file:// 协议打开 HTML 时，Chrome / Edge 默认禁用 data URL 作为 background-image；Firefox 则通常允许。这不是 CSS 写错了，而是浏览器策略限制。
临时解决办法：
- 换 Firefox 测试
- 起个本地服务：
npx serve或python3 -m http.server 8000，用http://localhost:8000访问 - 确认页面协议和 PDF 链接协议一致（HTTPS 页面里别写
http://xxx.pdf，否则混合内容被拦截）
真正难调试的，往往是协议不一致或本地文件协议限制，而不是选择器本身。
