如何使用CSS仅选中指向HTTPS安全站点的链接并修改其颜色

你可以使用CSS的属性前缀匹配选择器来精准选中所有指向HTTPS站点的链接，具体实现如下：

代码修改方案 #

在你现有的CSS基础上新增一条匹配规则即可：

a {
    color: #333;
    font-size: 20px;
}
/* 新增规则：仅匹配href以https://开头的链接 */
a[href^="https://"] {
    color: #1a73e8; /* 此处可替换为你想要的任意颜色值 */
}

规则说明 #

[attr^="value"]是CSS原生的属性选择器语法，作用是匹配所有attr属性值以value作为开头的元素，这里我们用它筛选href属性以https://开头的<a>标签，刚好符合仅修改HTTPS安全链接样式的需求，不会影响HTTP协议的链接、站内相对路径链接等其他链接的样式。

可选补充：如果你需要同时匹配省略协议的自适应链接（例如<a href="//www.google.com">，这类链接会自动适配当前站点的协议，当前站点为HTTPS时跳转的也是HTTPS地址），可以额外补充一条规则：

a[href^="//"] {
    color: #1a73e8;
}

内容的提问来源于stack exchange，提问作者m-naeem66622