CSS quotes

The CSS quotes property allows you to specify quotation marks for <q> elements. By default, browsers use the default quotation marks, but you can use this property to change them. This property takes one or two values, which represent the opening and closing quotation marks. If two values are specified, the first value represents the opening quotation mark, and the second value represents the closing quotation mark. If only one value is specified, it is used for both opening and closing quotation marks.

Syntax:


quotes: "string1" "string2";
quotes: none;

Example:

Result:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

In the example above, we have used the default double quotation marks for the <q> element. You can customize the quotation marks using the quotes property.

Customizing Quotation Marks:

Value	Description
`quotes: '«' '»';`	Uses guillemet style quotation marks.
`quotes: '„' '“' '‚' '‘';`	Uses German style quotation marks.

You can also remove quotation marks by using quotes: none; as shown in the example above.