Change the Quotes with CSS

webdev

Browsers can automatically add quotations in pages for the HTML q element. The default quotes are the double quotations at the top of the text. This, however, is changeable.

The CSS quotes property allows you to set pairs of characters to be used for the quotations, in place of the default double quotes used by the browsers.

Here’s how it looks like:

 

You can set more than one pair of quotation symbols in the quotes values. Each pair, from left to right, will be used for each nested q element, from outside in. Here‘s an example.

Advertisements

The Author

Web developer and writer. @rpsthecoder in Twitter.