quotes

quotes CSS 属性用于设置引号的样式。

语法

/* Keyword value */
quotes: none;

/* <string> values */
quotes: "«" "»";           /* Set open-quote and close-quote to the French quotation marks */
quotes: "«" "»" "‹" "›";   /* Set two levels of quotation marks */

/* Global values */
quotes: inherit;
quotes: initial;
quotes: unset;

none
 content 属性的值 open-quote 和 close-quote 将不会展示引号.
[<string> <string>]+
一组或者多组<string> 的值对应 open-quote and close-quote. 第一对表示引号的外层,第二对表示第一个嵌套层,下一对表示第三层,依此类推。

语法格式

none | auto | [ <string> <string> ]+

示例

HTML

<q>To be or not to be. That's the question!</q>

CSS

q {
  quotes: '"' '"' "'" "'";
}
q::before {
  content: open-quote;
}
q:after {
  content: close-quote;
}

Result

备注

从Firefox 3.5开始,可以使用 -moz-initial读取quotes属性的初始值,这在Firefox的早期版本中是不可能的。

规范

Specification Status Comment
CSS Generated Content Module Level 3
quotes
Working Draft  
CSS Level 2 (Revision 1)
quotes
Recommendation Initial definition
初始值depends on user agent
适用元素all elements
是否是继承属性yes
适用媒体visual
计算值as specified
Animation typediscrete
正规顺序the unique non-ambiguous order defined by the formal grammar

浏览器兼容性

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
quotesChrome Full support 11Edge Full support 12Firefox Full support 1.5IE Full support 8Opera Full support 4Safari Full support 9WebView Android Full support 37Chrome Android Full support 18Firefox Android Full support 4Opera Android ? Safari iOS Full support 9Samsung Internet Android ?
auto keywordChrome No support No
Notes
No support No
Notes
Notes This value is not supported, but the default browser behavior is to choose appropriate quotes for the user's language setting
Edge No support No
Notes
No support No
Notes
Notes This value is not supported, but the default browser behavior is to choose appropriate quotes for the user's language setting
Firefox Full support 70IE No support No
Notes
No support No
Notes
Notes This value is not supported, but the default browser behavior is to choose appropriate quotes for the user's language setting
Opera No support No
Notes
No support No
Notes
Notes This value is not supported, but the default browser behavior is to choose appropriate quotes for the user's language setting
Safari No support No
Notes
No support No
Notes
Notes This value is not supported, but the default browser behavior is to choose appropriate quotes for the user's language setting
WebView Android No support No
Notes
No support No
Notes
Notes This value is not supported, but the default browser behavior is to choose appropriate quotes for the user's language setting
Chrome Android No support No
Notes
No support No
Notes
Notes This value is not supported, but the default browser behavior is to choose appropriate quotes for the user's language setting
Firefox Android No support NoOpera Android No support No
Notes
No support No
Notes
Notes This value is not supported, but the default browser behavior is to choose appropriate quotes for the user's language setting
Safari iOS No support No
Notes
No support No
Notes
Notes This value is not supported, but the default browser behavior is to choose appropriate quotes for the user's language setting
Samsung Internet Android No support No
Notes
No support No
Notes
Notes This value is not supported, but the default browser behavior is to choose appropriate quotes for the user's language setting

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
See implementation notes.
See implementation notes.

参考