Definition and Usage
The quotes CSS property indicates how user agents should render quotation marks.
- Initial user agent specific
- Applies to all elements
- Inherited yes
- Media visual
- Computed Value as specified
- Animatable no
- Canonical order the unique non-ambiguous order defined by the formal grammar
Syntax
Formal syntax: [<string> <string>]+ | none
quotes: none
quotes: "«" "»" /* Set open-quote and close-quote to the French quotation marks */
quotes: "«" "»" "‹" "›" /* Set two levels of quotation marks */
quotes: inherit
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.
Examples
q { quotes: '"' '"' "'" "'" }
q:before { content: open-quote }
q:after { content: close-quote }
Compatibility
Desktop browsers
Feature |
Chrome |
Firefox (Gecko) |
Internet Explorer |
Opera |
Safari (WebKit) |
Basic support |
11 |
1.5 |
8.0 |
4.0 |
NA |
Mobile browsers
Feature |
Android |
Firefox Mobile (Gecko) |
IE Phone |
Opera Mobile |
Safari Mobile |
Basic support |
NA |
NA |
NA |
NA |
NA |