Home  >  Article  >  Web Front-end  >  What are the attributes of background images in css

What are the attributes of background images in css

王林
王林Original
2020-11-23 11:14:0711076browse

The attributes of background images in css are: 1. background-image; 2. background-repeat; 3. background-position; 4. background-size; 5. background-attachment.

What are the attributes of background images in css
The operating environment of this tutorial: Windows 10 system, CSS3 version. This method is suitable for all brands of computers.

(Learning video sharing: css video tutorial)

Common image attributes are:

1. Background image insertion

background-image:url(位置及名称);  //默认在父级元素内的左上角

2. Background tiling method

background-repeat:no-repeat;   //不平铺

3. Background position

background-position:right bottom;  //横向在右边,纵向在下边,即右下角
center center;  //位于中心
center right;  //中间靠右
100px 200px;  //靠左100 靠上200

4. Background size

background-size:cover/contain/100% 100%  等比例缩放(铺满即可)/包含在里面/按盒子大小缩放

Note: Lower versions of IE do not support background size

5. Background display method

background-attachment:scroll//随屏幕滚动 fixed//固定在可视区域,注意:此时的位置是相对于可视区域的
(fixed:这里有一个兼容性性的问题,在IE6中,只有html和body支持这个属性)

Related recommendations: CSS tutorial

The above is the detailed content of What are the attributes of background images in 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