"CSS Learning notes" background image

Look directly at the code:

Background:blue;

/* page background is blue, very simple code */
Background-image:url (small.jpg);

/* page background is a picture named Small.jpg */
Background-repeat:no-repeat;

/* Horizontal Display Picture repeat-x vertical display picture repeat-y not repeat picture no-repeat*/
background-attachment:fixed;

/* When the page has a particularly long scroll bar, you can pin the picture */

Relevant knowledge points:

1. Background map and background color, all set, display the background map.

2. Why do some sites have both background and background color?

Reason 1: Considering that the background of the site is not enough to fill the entire display area under a large screen (such as 1920*1080 or larger), the background color is displayed outside the background, and the edges of the background image must be handled properly to ensure smooth transition to the background color without abrupt feeling.

Reason 2: Not only the page, the Div, the table has a background map should still set a background color (similar to the background map color, at least with the text color significantly different). After all, sometimes the background map can not open the case, in this case if the text is white and the background color is the default white, the text will not be visible. After the completion of a Web page, try to change the folder where the image is stored so that the page renders without graphics, and see if the light text is readable. For CSS files, you should also do the same test once to see if the CSS file is not being called. If the website is opened slowly due to network speed or code redundancy, the picture cannot be loaded to show the background color first.

If you are a black for the main theme of the site, the default background color is white, then the picture is not loaded to complete the first white, resulting in a sense of flicker, visual unfriendly, according to the site's primary color definition of a background color, to reduce visual fatigue (usually first define the background color, and then define the background image, color first)

"CSS Learning notes" background image