HTML DOM Style quotes Property
The Style quotes Property in HTML DOM is used to set/return the type of quotation marks for embedded quotations. This element can be accessed by using getElementById() method.
Syntax:
- To get the property.
object.style.quotes
- To set the property.
object.style.quotes = "none | string string string string|initial|inherit"
Return Value: It returns the type of quotation of <q> tag.
Property Values:
- none: This is the default value. It specifies that the open-quote and close-quote values will not produce any quotation marks.
- string string string string: It specifies the quotation marks to use. The first two values define the first level of quotation embedding, the second two values define the second level of quote embedding, etc
- initial: Sets this property to its default value.
- inherit: Inherits this property from its parent element.
Quotation Marks characters and Entity Numbers:
Quotation Marks | Entity Numbers |
---|---|
double Quote | \0022 |
single quote | \0027 |
single, left angle quote | \2039 |
single, right angle quote | \203A |
double, left angle quote | \00AB |
double, right angle quote | \00BB |
left quote (single high-6) | \2018 |
right quote (single high-9) | \2019 |
left quote (double high-6) | \201C |
right quote (double high-9) | \201D |
double quote (double low-9) | \201E |
Example 1: In this example, we will change the quotes property.
html
<!DOCTYPE html> < html > < head > < title >DOM Style quotes Property</ title > </ head > < body style = "text-align: center;" > < h1 style = "color:green;" > w3wiki </ h1 > < q id = "myQ" style = "font-size: 20px;" > DOM Style quotes Property </ q > < br >< br > < button type = "button" onclick = "myFunc()" > Change Quotation Style </ button > < script > function myFunc() { // Change quotes document.getElementById("myQ") .style.quotes = "'‘' '’'"; } </ script > </ body > </ html > |
Output:
Example 2: Change quotes property using entity number.
html
<!DOCTYPE html> < html > < head > < title >DOM Style quotes Property</ title > </ head > < body style = "text-align: center;" > < h1 style = "color:green;" > w3wiki </ h1 > < q id = "myQ" style = "font-size: 20px;" > DOM Style quotes Property </ q > < br >< br > < button type = "button" onclick = "myFunc()" > Change Quotation Style </ button > < script > function myFunc() { // Change quote document.getElementById("myQ") .style.quotes = "'\253' '\273'"; } </ script > </ body > </ html > |
Output:
Supported Browsers: The browser supported by HTML DOM Style quotes Property are listed below:
- Google Chrome 11 and above
- Edge 12 and above
- Mozilla Firefox 1.5 and above
- Opera 4 and above
- Safari 9 and above
- Internet Explorer 8 and above