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
andclose-quote
values of thecontent
property produce no quotation marks. [<string> <string>]+
- One or more pairs of
<string>
values foropen-quote
andclose-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 value | depends on user agent |
---|---|
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 |
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