quotes

Avatar of Sara Cope
Sara Cope

DigitalOcean 为您旅程的每个阶段提供云产品。 立即开始使用 $200 免费积分!

CSS 中的 quotes 属性允许您指定通过 content: open-quote;content: close-quote; 规则添加引号时使用的引号类型。 以下是使用方法

q {
  quotes: "“" "”" "‘" "’";
}
q::before {
    content: open-quote;
}
q::after {
    content: close-quote;
}

在上面的示例中,添加了四个值。 一组双 智能引号 和一对单智能引号。 这有点令人困惑,因为每个引号都用引号包裹 - 但这些只是程序引号(可能是双引号 (“) 或单引号 (’)),就像 CSS 中的任何其他地方一样。 内部引号将在页面上使用。

quotes 属性相关的 content 属性有四个值:open-quoteclose-quoteno-open-quoteno-close-quote

值中的第一对引号是开头和结尾引号。 第二对引号是嵌套在也使用 quotes 属性的其他引号中的一级深的引号的开头和结尾引号。 例如,<q> 元素位于 <q> 元素内部。

一些示例

第一个引号使用双引号,第二个引号使用单引号。

带法语引号的引号。

您可以在 quotes 属性中放置任意多对引号。 但您不必放置超过两对,因为对于每个额外的引号,它只简单地重复 quotes 值的开头部分。

no-open-quoteno-close-quote 值会阻止引号显示,但它们会继续增加引号深度。

更多信息

相关属性

其他资源

浏览器支持

Chrome Safari Firefox Opera IE Android iOS
11+ 任何 1.5+ 4+ 8+ 任何 任何