CSS3关于background-size属性

2019-09-11 郑州网站建设  

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://tzchb.ieyo.com/dede/1976.html转载请标明出处,谢谢合作!
标签:
  • CSS3backgrou
  • bachground