HTML Color
Posted in HTML Tutorials |
Email This Post
Colors can be applied to a Webpage using style attribute with color name as hexadecimal value of the color.
Foreground
In this we can apply color to the text.
This can be done using style=”color:{color}”, where {color} is the color name.
Example:
<html> <head> <title> webpage using color </title></head> <body> <h1 style="color:red">This is an example of colored text</h1> </body> </html>
Background
In this we can apply Background color to the text.
This can be done using style=”background-color:{color}”, where {color} is the color name.
Example:
<html> <head> <title> webpage using color </title></head> <body> <h1 style="background-color:red">This is an example of Background text</h1> </body> </html>
Border Color
To add a color border surrounding text.
This can be done using style=”border:{width} {color} {style}”, where {width} is the width of the border, {color} is the color of the border, and {style} is the style of the border.
Example:
<html> <head> <title> webpage using color </title></head> <body> <h1 style="border:1px red solid;">This is an example of Border color text</h1> </body> </html>
Common example:
<html> <head> <title> webpage using color </title></head> <body> <h1 style="color:red">This is an example of colored text</h1> <hr/> <h1 style="background-color:red">This is an example of Background text</h1> <hr/> <h1 style="border:1px red solid;">This is an example of Border color text</h1> </body> </html>
Output:
