html5 set color

HTML5 is a language for creating web content. The color settings are very important for web design. In HTML5, colors can be set in a variety of ways, including using color names, RGB values, hexadecimal values, and HSL values.

Color names are one of the simplest methods, they are a set of predefined color names, such as red, green, blue, etc. Here are some commonly used color names in HTML5:

<font color="red">红色</font>
<font color="green">绿色</font>
<font color="blue">蓝色</font>
<font color="pink">粉色</font>
<font color="purple">紫色</font>

Another way to set colors is to use RGB values. RGB values ​​consist of three numbers that represent the values ​​of red, green, and blue. Each value ranges from 0 to 255, and the color can be set using the following code:

<font color="rgb(255, 0, 0)">红色</font>
<font color="rgb(0, 255, 0)">绿色</font>
<font color="rgb(0, 0, 255)">蓝色</font>
<font color="rgb(255, 192, 203)">粉色</font>
<font color="rgb(128, 0, 128)">紫色</font>

Using hexadecimal values ​​is also a common way to set colors. The hexadecimal value consists of six characters, the first two characters represent the red value, the middle two characters represent the green value, and the last two characters represent the blue value. Each character has a value from 0 to F, where 0 represents the minimum value and F represents the maximum value. The following is an example of setting a color using a hexadecimal value:

<font color="#FF0000">红色</font>
<font color="#00FF00">绿色</font>
<font color="#0000FF">蓝色</font>
<font color="#FFC0CB">粉色</font>
<font color="#800080">紫色</font>

HSL values ​​are a newer way of setting a color, the color can be set using the following code:

<font color="hsl(0, 100%, 50%)">红色</font>
<font color="hsl(120, 100%, 50%)">绿色</font>
<font color="hsl(240, 100%, 50%)">蓝色</font>
<font color="hsl(350, 100%, 88%)">粉色</font>
<font color="hsl(300, 100%, 25%)">紫色</font>

Where, H represents hue, S represents saturation, and L represents lightness. Hue has values ​​from 0 to 360, and saturation and brightness have values ​​from 0% to 100%.

In addition to the above methods, you can also use CSS style sheets to set colors. Using a style sheet allows you to easily centrally define the colors of all web page elements and make the page easier to manage and update. Here is an example of setting colors using CSS:

<style>
.red {
  color: red;
}

.green {
  color: green;
}

.blue {
  color: blue;
}

.pink {
  color: pink;
}

.purple {
  color: purple;
}
</style>

<font class="red">红色</font>
<font class="green">绿色</font>
<font class="blue">蓝色</font>
<font class="pink">粉色</font>
<font class="purple">紫色</font>

As mentioned above, there are multiple ways to set colors in HTML5. Which method you choose depends on your color needs and personal preference. No matter which method you choose, be sure to pay attention to the use of color to make the page more beautiful and easy to read.

The above is the detailed content of html5 set color. For more information, please follow other related articles on the PHP Chinese website!