Home > Article > Web Front-end > How to modify web page color in html
How to modify web page color in html
- PHPzOriginal
- 2023-04-13 10:46:204628browse
HTML is the most basic part of web development, and the color selection of web pages is also very important. HTML provides several methods to change the color of web pages, including changing the page background color, text color, and link color.
1. Web page background color
- Use color names
HTML provides 137 color names, such as red, blue, green and other common colors. Add the style attribute to the body tag, use the background-color attribute, and use the color name as the attribute value to change the background color.
<body style="background-color: red;">
- Using hexadecimal color values
In addition to color names, you can also use hexadecimal color values to change the background color. Add the style attribute to the body tag, use the background-color attribute, and use the color value as the attribute value.
<body style="background-color: #FF0000;">
2. Text color
- Use color name
The color of text can also be changed using color name. Add the style attribute to the tag whose color needs to be changed, use the color attribute, and use the color name as the attribute value.
<p style="color: green;">这是一个绿色的段落</p>
- Using hexadecimal color values
Similarly, the color of text can also be changed using hexadecimal color values. Add the style attribute to the tag whose color needs to be changed, use the color attribute, and use the color value as the attribute value.
<p style="color: #00FF00;">这是一个绿色的段落</p>
3. Link color
- Modify the color of the link when it is not visited
Add the style attribute to the a tag, use the color attribute, and change the color The name or color value can be used as the attribute value. If you want to change the color of a link when the mouse is hovering, you can use the :hover pseudo-class.
<a href="#" style="color: red;">未访问链接</a>
<a href="#" style="color: #FF0000;">未访问链接</a>
<a href="#" style="color: red;">鼠标悬停链接</a>:hover { color: blue; }
<a href="#" style="color: #FF0000;">鼠标悬停链接</a>:hover { color: #0000FF; }
- Modify the color when the link has been visited
Add the style attribute in the a:visited pseudo-class, use the color attribute, and use the color name or color value as the attribute value That’s it.
a:visited { color: gray; }
a:visited { color: #808080; }
Summary
The above are some basic methods for changing colors in HTML. By selecting the color name or RGB hexadecimal value, the web page can show a unique style. In actual development, CSS can also be used to more flexibly control web page colors. Hope this article is helpful to beginners.
The above is the detailed content of How to modify web page color in html. For more information, please follow other related articles on the PHP Chinese website!