Home  >  Article  >  Web Front-end  >  How to set body style with css

How to set body style with css

PHPz
PHPzOriginal
2023-04-13 10:26:433264browse

CSS (Cascading Style Sheet) is a language used for web design and layout, which can control the style and layout of web page elements. Setting the CSS style of the body is also an important part of web design. Here are some commonly used CSS properties to control the style of the body.

1. Set the background color
Setting the background color of the body is a basic style setting in web design. You can use the background-color attribute, for example:

body {
  background-color: #f1f1f1;
}

This will change the body's background color. The background color is set to gray. Different colors can be used as needed.

2. Set the background image
Setting the background image of the body is also a commonly used style effect in web design. You can use the background-image attribute, for example:

body {
  background-image: url('example.jpg');
}

This will be in the body Add an image named "example.jpg" as a background. Image files in other formats, such as .png, .gif, etc., can also be used. You can use other properties to control the size and position of the image.

3. Set the font
Setting the text style in the body is also an important part of web design. You can use font-family to set the text font, for example:

body {
  font-family: Arial, Helvetica, sans-serif;
}

This will The text font is set to Arial, and if this font is not available, an alternative font like Helvetica is used, eventually falling back to a sans-serif font.

4. Set the text size
Setting the size of the text in the body is also an important part of web design. You can use the font-size attribute to set the text size, for example:

body {
  font-size: 16px;
}

This will Set the text size to 16 pixels, you can use different sizes if needed.

5. Set the text color
Setting the color of the text in the body is also one of the basic style effects in web design. You can use the color attribute, for example:

body {
  color: #333;
}

This will change the color of the text in the body. The text color is set to dark gray, you can use different colors as needed.

6. Set the line height
Setting the height of the line in the body is also a part of web design. You can use the line-height attribute, for example:

body {
  line-height: 1.5;
}

This will set the line height to 1.5 Times the text size, you can use different sizes as needed.

7. Setting the margin
Setting the margin of the body is also a part of web design. You can use the margin attribute, for example:

body {
  margin: 0;
}

This will set the margin of the body to 0 , you can also set the top, bottom, left and right margins separately.

In short, setting the CSS style of the body is an important part of web design. You can use a variety of CSS properties to control different style effects and use them flexibly as needed.

The above is the detailed content of How to set body style with css. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn