How to set background color in html? Two ways to teach you-HTML Tutorial-php.cn

How to set background color in html? Two ways to teach you

云罗郡主

Release： 2018-12-24 13:20:53

Original

46307 people have browsed it

htmlHow to set the background color? PHP Chinese website teaches you how to set the background color of web pages by editing HTML. I hope it will be of some help to you.

1: Set the background color

1. Prepare to edit HTML

First determine the background color to be used, the HTML color is determined by each code. Visit http://www.php.cn/html/html-colornames.html in your computer's web browser to view the codes for all colors and select the base color you want to use in the "HEX" section.

2. Use Notepad or Notepad to open the HTML file and add all the style information of the page (including background color). Add the "background-color" attribute to the "body" element. Background-color should be entered between the body brackets, as follows:

<body bgcolor="red">背景红色

Copy after login

body { 
    background-color：red
}

Copy after login

How to set background color in html? Two ways to teach you

3. You can use "background-color" to define other The background of elements such as titles, paragraphs, etc. For example, you want to apply a background color to a main heading (

) or a paragraph (

2: Create a gradient background

1. When making a gradient, we need two pieces of information, the starting point and angle, and the color of the transition between gradients. You can select multiple colors to have the gradient move between them all, and you can set the direction or angle of the gradient.

Attributes:

Background: linear gradient (direction/angle, color 1, color 2, color 3, etc.);

2. When making a vertical gradient, if If no direction is specified, the gradient will go from top to bottom. To create a gradient, add the following code between the tags:

html { 
    min-height ： 100％;  
} 
body { 
    background ： -webkit-linear-gradient（left ，＃93B874 ，＃C9DCB9 ）;  
    background ： -o-linear-gradient（right，＃93B874 ，＃C9DCB9 ）; 
    background ： -moz-linear-gradient（right，＃93B874 ，＃C9DCB9 ）;  
    背景：线性梯度（到右侧，＃93B874 ，＃C9DCB9 ）; 
    background-color ：＃93B874 ;  
}

Copy after login

Of course, you can also add a direction to the gradient to change the color. The way offsets appear, not only can you add more than two colors, you can also add a percentage after each color. You can also set the desired spacing between each color segment, add transparency to your colors, and fade from color to void using the same color. You can also use the rgba() function to define colors. The end value determines the transparency: 0 solid and 1 transparent.

The above is the complete introduction to how to set the background color of html. If you want to know more about HTML video tutorial, please pay attention to the php Chinese website.

The above is the detailed content of How to set background color in html? Two ways to teach you. For more information, please follow other related articles on the PHP Chinese website!