Latest

recent

CSS quotes Property

Definition

The quotes property sets the type of quotation marks for embedded quotations.
Inherited: Yes

JavaScript Syntax

CSS properties can also be dynamically changed with a JavaScript.
Scripting Syntax: object.style.quotes="none"

Example

Example 1

q:lang(en)
{
quotes: '"' '"' "'" "'"
}
the style above and the following HTML file:

<html lang="en">
<head>
</head>
<body>
<p><q>This is a <q>big</q> quote</q></p>
</body>
</html>

would produce this output:

"This is a 'big' quote"

Example 2

q:lang(no)
{
quotes: "«" "»" "'" "'"
}
the style above and the following HTML file:

<html lang="no">
<head>
</head>
<body>
<p><q>Vi synger <q>Mellom bakkar og berg</q> på 17.mai.</q>
</body>
</html>
would produce this output:
«Vi synger 'Mellom bakkar og berg' på 17.mai.»

Possible Values

Value Description
none Specifies that the "open-quote" and "close-quote" values of the "content" property will not produce any quotation marks
string string string string Defines the quotation marks to use. The first two values specifies the first level of quotation embedding, the next two values specifies the next level of quote embedding, etc

Quotation Mark Characters

Result Description Entity Number
" double quote &#34;
' single quote &#39;
single, left angle quote &#8249;
single, right angle quote &#8250;
« double, left angle quote &#171;
» double, right angle quote &#187;
left quote (single high-6) &#8216;
right quote (single high-9) &#8217;
left quote (double high-6) &#8220;
right quote (double high-9) &#8221;
double quote (double low-9) &#8222;

 Goto CSS3 and CSS2 complete reference
CSS quotes Property Reviewed by 1000sourcecodes on 21:38 Rating: 5
Powered by Blogger.