HTML | DOM Style fontStyle Property
HTML DOM Style fontStyle Property is used to set or get font style of an element dynamically.
Syntax:
- To set the fontStyle property :
object.style.fontStyle = normal|italic|oblique|initial|inherit;
- To get fontStyle property value:
object.style.height
Property values:
| Value |
|---|
| normal |
| italic |
| oblique |
| initial |
| inherit |
Return Value: String that gives fontStyle of the element.
Example:
HTML
<!DOCTYPE html><html><head> <title> HTML | DOM Style fontStyle Property </title> <style> #gfg { color: green; font-size: 100px; font-style: normal; } </style></head><body> <center> <button onclick="changeStyle()"> Click to change style </button> <!-- Script to change the fontStyle --> <script> function changeStyle() { document.getElementById("gfg").style.fontStyle = "italic"; } </script> <p id="gfg"> Geeks For Geeks </p> </center></body></html> |
Output
Before clicking on the button:
After clicking on the button:
Example:
HTML
<!DOCTYPE html><html><head> <title> HTML | DOM Style fontStyle Property </title> <style> #gfg { color: green; font-size: 50px; font-style: normal; } </style></head><body> <center> <br> <button onclick="changeStyle()"> Click to change style </button> <br /> <br /> <!-- Script to change the fontStyle --> <script> function changeStyle() { document.getElementById("gfg").style.fontStyle = "oblique"; } </script> <div id="gfg"> HTML DOM fontStyle Property </div> </center></body></html> |
Output:
Before clicking on the button:
After clicking on the button:
Supported Browsers: The browser supported by HTML | DOM Style fontStyle Property are listed below:
- Google Chrome 1.0 and above
- Edge 12.0 and above
- Internet Explorer 4.0 and above
- Firefox 1.0 and above
- Opera 7.0 and above
- Safari 1.0 and above
Please Login to comment...