Javascript 为什么CSS对：：after的更改也会影响：：before？

为什么在这些blockquotes中的：：after元素上设置

display:none

或

content:none

会导致：：after元素半隐藏，除了出于某种原因在第一个元素中之外？您可以在代码段中看到，在：：after伪元素上设置了

display:none

，如果删除它，引号将正确显示

let quotes=document.querySelector（“#quotes”），
json=[
{“作者姓名”：“苏格拉底”，
“相对时间描述”：“2395年前”，
“文本”：“正如我想象的那样，很少有人会想到，从别人的邪恶中，有邪恶的东西会传播给他们自己。”，
{“作者姓名”：“苏格拉底”，
“相对时间描述”：“2395年前”，
“文本”："那么，我们难道不能推断，从荷马开始，所有这些富有诗意的人都只是模仿者；他们模仿美德之类的形象，但他们永远达不到真理吗？诗人就像一位画家，正如我们已经观察到的那样，尽管他对补鞋匠一窍不通，但他会模仿一个补鞋匠；他的画足以让我们理解他知道的并不比他多，只凭颜色和数字来判断，
{“作者姓名”：“达蒙”，
“相对时间描述”：“大约3000年前”，
“文本”：“……当音乐模式改变时，国家的基本法则也随之改变。”}]；
Object.keys（json）.forEach（函数（键）{
设r=json[key]，
tpl=document.querySelector（'#tpl'）.content.cloneNode（true）；
tpl.querySelector（'blockquote'）.childNodes[0]。nodeValue=r.text；
tpl.querySelector（'.author'）.textContent=r.author\u name；
tpl.querySelector（'.ago'）.textContent=r.relative\u time\u description；
引证.附加儿童（tpl）；
})；

html{font size:20px；}
#引用{
列表样式：无；
利润率：1米0；
填充：1em 0；
显示器：flex；
弯曲方向：行；
柔性包装：包装；
证明内容：周围的空间；
对齐项目：拉伸；
}
#引用李的话{
flex:1自动；
最大宽度：10em；
显示器：flex；
弯曲方向：行；
柔性包装：nowrap；
证明内容：拉伸；
对齐项目：拉伸；
}
html块报价{
位置：相对位置；
利润率：1米0；
填充：.618em 1.236em；
左边框：6px实心#bf0a30；
背景：#002868；
颜色：#E6；
}
.引用{
显示器：flex；
弯曲方向：立柱；
柔性包装：nowrap；
证明内容：拉伸；
对齐项目：拉伸；
字体大小：.8em；
}
引用{padding:1em 0；}
引用p{margin:0；}
html blockquote:：before，html blockquote:：after{
位置：绝对位置；
最高：33%；
字号：1em；
字号：700；
}
html blockquote:：before{
内容：公开报价；
左：.155em；
}
html blockquote:：after{
内容：关闭报价；
对:155em,；
}
.quote:：之前，.quote:：之后{top:auto}
.quote:：在{底部：0；显示：无；}之后

这似乎与应用于：after和：before的

打开报价

和

关闭报价

的行为有关

如果您确实需要

打开报价

，而不是

关闭报价

。只需添加

无关闭报价

就这样,

html blockquote::after {
    content: no-close-quote;
    right: .155em;
    z-index: 1;
}

另外，请记住删除您在：after上显示的

显示：none；

，否则将无法工作

如果有帮助，请告诉我：）

编辑以回答评论

由于您尚未在

blockquote

元素上定义属性，因此默认值为：

quotes:”；

。注意：每种语言的默认值不同。请参阅

quotes

属性中的前两个引号将始终用于非嵌套引号，因此在这种情况下将使用

“

”

最后两个引号将始终用于嵌套引号，因此在这种情况下将使用

“”“”

在您的案例中，您删除了所有结束引号。因此，从技术上讲，您的第一个引号从未结束。因为它从未结束，所以从技术上讲，以下所有引号都成为嵌套引号-因此，除第一个引号外，所有引号都使用了

“”“”

通过添加

content:no close quote；

，正如我上面所建议的，您可以告诉浏览器，即使它不应该呈现一个close quote。该quote仍然应该被关闭。因此，如果您添加

content:no close quote；

，第一个后面的所有quote都将使用

“

而不是

”

---

希望我的澄清有意义。请告诉我是否有意义。

我怀疑这是因为

：

后伪元素与下一个元素的

：：前伪元素重叠。