Tutorials Point


  CSS Home

  CSS Reference
  Pseudo Classes & Elements

© 2011 TutorialsPoint.COM


  Home     References     Discussion Forums     About TP  

CSS - quotes


previous next AddThis Social Bookmark Button


Description:

The quotes property is used to define the quotation pairs which are used at each level of nested quotation.

Possible Values:

  • <string><string>: A pair of string values which are used to represent the open- and close-quotes.
  • none: This prevents the values open-quote and close-quote on the property content from generating any quotation marks.

Applies to:

All the HTML elements

Example:

Here is the example:

<style tyle="text/css">
<!--
blockquote {quotes: '"' '"' "'" "'";}
q:lang(fr) {quotes: "<<" ">>" "<" ">";}
-->
</style>

In a document that needs to address this difference, you can use the :lang pseudo-class to change the quote marks appropriately. The following code changes the <blockquote> tag appropriately for the language being used:

<style type="text/css">
/* Two levels of quotes for two languages*/
:lang(en) { quotes: '"' '"'  "'"  "'"; }
:lang(fr) { quotes: "<<" ">>" "<" ">"; }
</style>
<p>...<q lang="fr">A quote in a paragraph</q>...</p>

The :lang selectors will apply to all elements in the document. However, not all elements make use of the quotes property, so the effect will be transparent for most elements.

...A quote in a paragraph...

To Become more comfortable - Do Online Practice


previous next Printer Friendly



  

Advertisement

Online Image Processing

Indian Baby Names