Definition and Usage
The quotes CSS property indicates how user agents should render quotation marks.
- Initialuser agent specific
- Applies toall elements
- Inheritedyes
- Mediavisual
- Computed Valueas specified
- Animatableno
- Canonical orderthe 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
1 |
q { quotes: '"' '"' "'" "'" } |
2 |
q:before { content: open-quote } |
3 |
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 |
