Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

Background attribute description and attribute value description of CSS

2025-02-22 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/03 Report--

This article mainly explains the "CSS background attribute description and attribute value description", the content of the article is simple and clear, easy to learn and understand, the following please follow the editor's ideas slowly in depth, together to study and learn "CSS background attribute description and attribute value description" bar!

The background attribute Property describes the background color of the background-color setting element. Background-image sets the image as the background. Background-size sets the size of the background image. Background-origin sets the positioning area of the background image. Background-clip sets the painting area of the background image. Background-position sets the starting position of the background image. Background-repeat sets whether and how the background image is repeated. Whether the background-attachment background image is fixed or scrolled with the rest of the page. Background shorthand property, which sets the background property in a declaration. Background color

The background-color attribute defines the background color of the element.

The background color of the page is used in the selector of body:

In CSS, color values are usually defined in the following ways:

Hexadecimal-such as "# ff0000"

RGB-such as: "rgb (255pr 0penol 0)"

Color name-e. G. "red"

In the following example, the H2, p, and div elements have different background colors:

The property value indicates that color specifies the background color. Find a complete list of CSS color values where possible. Transparent specifies that the background color should be transparent. This is the default inherit that specifies the background color and should inherit the background image from the parent element

The background-image property sets the background image of an element.

The background of the element is the total size of the element, including fills and boundaries (but excluding margins).

By default, the background-image is placed in the upper-left corner of the element and repeats the vertical and horizontal directions. Http://www.jzspfk.com/ of Ningbo Men's Hospital

Tip: please set an available background color so that if the background image is not available, you can use the background ribbon instead.

The attribute value indicates that the URLnone of the url ('URL') image is displayed without an image background. This is the default linear-gradient () to create a linear gradient "image" (from top to bottom) radial-gradient () to create an "image" with a radial gradient. (center to edges) repeating-linear-gradient () creates a repetitive linear gradient "image". Repeating-radial-gradient () creates a repetitive radial gradient "image" inherit that specifies that the background image should inherit the size attribute value of the image from the parent element, indicating that length sets the height and width of the background image. The first value sets the width and the second value sets the height. If only one value is given, the second is set to auto (automatic) percentage will calculate the percentage relative to the background positioning area. The first value sets the width and the second value sets the height. If only one value is given, the second is set to "auto" cover. At this point, the aspect ratio of the image is maintained and the image is scaled to the minimum size that will completely cover the background positioning area. Contain now maintains the aspect ratio of the image and scales the image to the maximum size that will fit the background positioning area. The location area of the image

The background-Origin attribute specifies that the background-position property should be in a relative position.

Note: if the background image background-attachment is "fixed", this property has no effect.

The attribute value indicates the relative position of the padding-box background image fill box, the relative position of the border-box background image bounding box, the relative position of the content-box background image, the drawing area of the content box image

The background-clip property specifies the background drawing area.

The property value indicates the border-box default value. The background is drawn inside the border box (cut into a border box). The padding-box background is drawn in the contrast box (cut into the contrast box). The content-box background is drawn in the content box (cut into the content box). The starting position of the image

The background-position property sets the location of the background image. If the specified location does not have any background, the image is always placed in the upper-left corner of the element.

Attribute value value description left top

Left center

Left bottom

Right top

Right center

Right bottom

Center top

Center center

If center bottom specifies only one keyword, the other value will be "center" x% y% the first value is horizontal and the second value is vertical. The upper left corner is 0% 0%.

The lower right corner is 100% 100%. If only one value is specified, the other values will be 50%.

The default value is: 0%0%xpos ypos the first value is horizontal and the second value is vertical. The upper left corner is 0

The units can be pixels (0px0px) or any other CSS unit.

If only one value is specified, the other values will be 50%. You can mix it.

% and positionsinherit specify that the background-position property setting should inherit the image horizontal or vertical tiling from the parent element

By default, the background-image property is tiled horizontally or vertically on the page.

The attribute value indicates that the repeat background image will repeat vertically and horizontally. This is the default repeat-x only the horizontal position will repeat the background image repeat-y only the vertical position will repeat the background image no-repeatbackground-image will not repeat inherit specifies that the background-repea property setting should inherit image scrolling from the parent element

Background-attachment sets whether the background image is fixed or scrolled along with the rest of the page.

The property value indicates that the scroll background image scrolls as the page scrolls, which is the default. The fixed background picture does not scroll as the page scrolls. The local background picture scrolls as the element content scrolls. Initial sets the default value for this property. Read about initial content inherit specifies that the setting of background-attachment should be inherited from the parent element. Thank you for your reading, the above is the "CSS background attribute description and attribute value description" content, after the study of this article, I believe you have a deeper understanding of the CSS background attribute description and attribute value description of this problem, the specific use of the need for practice to verify. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report