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:
1.<html>2.<head>3.<title> webpage using color </title></head>4.<body>5.<h1 style="color:red">This is an example of colored text</h1>6.</body>7.</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:
1.<html>2.<head>3.<title> webpage using color </title></head>4.<body>5.<h1 style="background-color:red">This is an example of Background text</h1>6.</body>7.</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:
1.<html>2.<head>3.<title> webpage using color </title></head>4.<body>5.<h1 style="border:1px red solid;">This is an example of Border color text</h1>6.</body>7.</html>Common example:
01.<html>02.<head>03.<title> webpage using color </title></head>04.<body>05.<h1 style="color:red">This is an example of colored text</h1>06.<hr/>07.<h1 style="background-color:red">This is an example of Background text</h1>08.<hr/>09.<h1 style="border:1px red solid;">This is an example of Border color text</h1>10.</body>11.</html>Output:
