为何使用open-quote伪元素时仅第一个元素显示双引号？

嘿，这个问题其实是CSS里的quotes属性在悄悄搞事情！我来给你掰扯清楚：

核心原因：open-quote的层级切换逻辑 #

你写的a::before { content: open-quote; }里的open-quote并不是固定输出双引号的，它会跟着引号嵌套层级自动切换符号。

浏览器默认的quotes属性值（以英文环境为例）是这样的：

quotes: "“" "”" "‘" "’";

简单说就是：第一层级用双引号（“”），第二层级用单引号（‘’）。当你给第一个<a>加open-quote时，属于第一层，所以输出双左引号；第二个<a>继续调用open-quote，相当于进入了下一层级，就自动切换成单左引号啦。

怎么让所有都显示双左引号？ #

有两种简单的解决办法：

1. 显式指定quotes属性，把层级固定为双引号：

a {
  quotes: "“" "”"; /* 只定义一对双引号，所有层级都用它 */
}
a::before {
  content: open-quote;
}

2. 直接写死引号内容，不用open-quote：

a::before {
  content: "“"; /* 直接输出双左引号 */
}

这样不管有多少个<a>元素，都会显示统一的双左引号啦～

内容的提问来源于stack exchange，提问作者Pavan Tiwari