CSS open-quote 显示 1 个引号

2024-03-04

我使用以下 CSS 在段落前添加左引号:

blockquote {
  padding: 22px;
  quotes: "\201C""\201D""\2018""\2019";
  font-size: 15px;
}
blockquote:before {
  color: #111;
  content: open-quote;
  font-size: 4em;
  line-height: 0;
  vertical-align: -0.4em;
}

当我添加两个以上的块引号时,它们仅显示 1 个引号。我想展示2"。我不明白为什么会发生这种情况。例如,请参见 jsfiddle。

http://jsfiddle.net/yg7j5mkm/ http://jsfiddle.net/yg7j5mkm/


您必须先关闭报价,然后才能打开另一报价。

这里有一个解决方法:关闭引号,但不可见。

blockquote {
  padding: 22px;
  quotes: "\201C""\201D""\2018""\2019";
  font-size: 15px;
}
blockquote:before {
  color: #111;
  content: open-quote;
  font-size: 4em;
  line-height: 0;
  vertical-align: -0.4em;
}
blockquote:after {
  visibility: hidden;
  content: close-quote;
}
<blockquote>
  <p style="display:inline;">Lorem ipsum dolor...</p>
</blockquote>

<blockquote>
  <p style="display:inline;">Lorem ipsum dolor...</p>
</blockquote>

<blockquote>
  <p style="display:inline;">Lorem ipsum dolor...</p>
</blockquote>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

CSS open-quote 显示 1 个引号 的相关文章