Home >Web Front-end >CSS Tutorial >css set background color
css set background color
- 藏色散人Original
- 2021-01-18 15:35:2731284browse
How to set the background color in css: first create an HTML sample file; then add the style tag in the head; then define a p tag and h1 tag in the body; and finally set the corresponding settings through the background-color attribute background color.
The operating environment of this article: Acer S40-51, Windows10 Home Chinese Edition, HTML5&&CSS3&&HBuilderX.3.0.5
Recommended: "css video tutorial"
How to set background color in css
In CSS, you can use the background-color attribute to set the background color.
The background-color property sets the background color of an element. The background of an element is the total size of the element, including padding and borders (but not margins).
The background-color property sets a solid color for the element. This color fills the element's content, padding, and border areas, extending to the outer bounds of the element's border (but not the margins). If the border has transparent parts (such as a dotted border), the background color will show through these transparent parts.
The values that the background-color attribute can be set to:
color_name: Specifies that the color value is the background color of the color name (such as red).
hex_number: Specifies the background color whose color value is a hexadecimal value (such as #ff0000).
rgb_number: Specifies that the color value is the background color of the rgb code (such as rgb(255,0,0)).
transparent: Default. The background color is transparent.
Although in most cases, there is no need to use transparent. However, if you don't want an element to have a background color, and you don't want the user's browser color settings to affect your design, then setting the transparent value is still necessary.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
body {
background-color: pink;
}
h1 {
background-color: #17c4ff;
}
p {
background-color: rgb(255, 218, 51);
}
</style>
</head>
<body>
<h1>这是标题 1</h1>
<p>这是一个段落。</p>
</body>
</html>Rendering:
The above is the detailed content of css set background color. For more information, please follow other related articles on the PHP Chinese website!