| # string-quotes |
| |
| Specify single or double quotes around strings. |
| |
| <!-- prettier-ignore --> |
| ```css |
| a[id="foo"] { content: "x"; } |
| /** ↑ ↑ ↑ ↑ |
| * These quotes and these quotes */ |
| ``` |
| |
| Quotes within comments are ignored. |
| |
| <!-- prettier-ignore --> |
| ```css |
| /* "This is fine" */ |
| /* 'And this is also fine' */ |
| ``` |
| |
| Single quotes in a charset @-rule are ignored as using single quotes in this context is incorrect according the [CSS specification](https://www.w3.org/TR/CSS2/syndata.html#x57). |
| |
| <!-- prettier-ignore --> |
| ```css |
| @charset "utf-8" |
| /* fine regardless of configuration */ |
| ``` |
| |
| The [`fix` option](../../../docs/user-guide/usage/options.md#fix) can automatically fix most of the problems reported by this rule. |
| |
| ## Options |
| |
| `string`: `"single"|"double"` |
| |
| ### `"single"` |
| |
| Strings _must always_ be wrapped with single quotes. |
| |
| The following patterns are considered violations: |
| |
| <!-- prettier-ignore --> |
| ```css |
| a { content: "x"; } |
| ``` |
| |
| <!-- prettier-ignore --> |
| ```css |
| a[id="foo"] {} |
| ``` |
| |
| The following patterns are _not_ considered violations: |
| |
| <!-- prettier-ignore --> |
| ```css |
| a { content: 'x'; } |
| ``` |
| |
| <!-- prettier-ignore --> |
| ```css |
| a[id='foo'] {} |
| ``` |
| |
| <!-- prettier-ignore --> |
| ```css |
| a { content: "x'y'z"; } |
| ``` |
| |
| ### `"double"` |
| |
| Strings _must always_ be wrapped with double quotes. |
| |
| The following patterns are considered violations: |
| |
| <!-- prettier-ignore --> |
| ```css |
| a { content: 'x'; } |
| ``` |
| |
| <!-- prettier-ignore --> |
| ```css |
| a[id='foo'] {} |
| ``` |
| |
| The following patterns are _not_ considered violations: |
| |
| <!-- prettier-ignore --> |
| ```css |
| a { content: "x"; } |
| ``` |
| |
| <!-- prettier-ignore --> |
| ```css |
| a[id="foo"] {} |
| ``` |
| |
| <!-- prettier-ignore --> |
| ```css |
| a { content: 'x"y"z'; } |
| ``` |
| |
| ## Optional secondary options |
| |
| ### `avoidEscape`: `true|false`, defaults to `true` |
| |
| Allows strings to use single-quotes or double-quotes so long as the string contains a quote that would have to be escaped otherwise. |
| |
| For example, with `"single", { "avoidEscape" : false }`. |
| |
| The following patterns are considered violations: |
| |
| <!-- prettier-ignore --> |
| ```css |
| a { content: "x'y'z"; } |
| ``` |
| |
| <!-- prettier-ignore --> |
| ```css |
| a[id="foo'bar'baz"] {} |
| ``` |
| |
| The following patterns are _not_ considered violations: |
| |
| <!-- prettier-ignore --> |
| ```css |
| a { content: 'x'; } |
| ``` |
| |
| <!-- prettier-ignore --> |
| ```css |
| a[id='foo'] {} |
| ``` |