CSS - quotes

The quotes CSS property indicates how user agents should render quotation marks.

Example

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

Syntax  

/* 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;

Values

none
The open-quote and close-quote values of the content property produce no quotation marks.
[<string> <string>]+
One or more pairs of <string> values for open-quote and close-quote. The first pair represents the outer level of quotation, the second pair is for the first nested level, next pair for third level and so on.

Formal syntax

[<string> <string>]+ | none

Description  

The quotes CSS property indicates how user agents should render quotation marks.

Initial valuedepends on user agent
Applies toall elements
Inheritedyes
Mediavisual
Computed valueas specified
Animatableno
Canonical orderthe unique non-ambiguous order defined by the formal grammar

Notes  

Starting in Firefox 3.5, the initial value of the quotes property can be read using -moz-initial This wasn't possible in earlier versions of Firefox.

See Also  

Specifications  

Specification Status Comment
CSS Level 2 (Revision 1)
The definition of 'quotes' in that specification.
Recommendation Initial definition

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 11 1.5 8.0 4.0 9.0 (at least)
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support ? ? ? ? ?

License

© 2016 Mozilla Contributors
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-us/docs/web/css/quotes