欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!

 

bachground-size属性就是定义背景图片的大小,其值有:auto , 像素值 ,百分比 , cover , contain

background-size:auto,默认值,以图片自身大小填充元素,根据元素大小来调节自身比例,不会让图片变形。

CSS3关于background-size属性

1.<!DOCTYPE html><html><head>

<meta charset="utf-8">

<title>background-size属性</title>

<style type="text/css">

div{

width:300px;

height:150px;

border:1px solid black;

background:url("photo.jpg") no-repeat;

}

</style></head><body>

<div></div></body></html>

2.背景图片本身大小—width:200px height:133px ,上述代码的效果图如下:

像素值,比如 30px 50px,分别表示width height

CSS3关于background-size属性

<!DOCTYPE html><html><head>

<meta charset="utf-8">

<title>background-size属性</title>

<style type="text/css">

div{

width:300px;

height:150px;

border:1px solid black;

background:url("photo.jpg") no-repeat;

background-size:250px 100px;

}

</style></head><body>

<div></div></body></html>

如需转载,请注明文章出处和来源网址:http://www.divcss5.com/css3-style/c40845.shtml