Html+Css之background-size属性

Html+Css之background-size属性

CSS3 background-size:[length|percentage|auto]{1,2}|cover|contain

浏览器参照基准:Firefox3.6 and Later, Chrome5 and Later, Safari5 and Later, Opera11.50 and Later, IE9.0 and Later

* 用于设置背景图片的大小,有2个可选值,第1个值用于指定背景图的width,第2个值用于指定背景图的height,如果只指定1个值得,则第2个值默认为auto;

背景图尺寸(数值表示方式):

#background-size{ background-size:300px 100px; }

背景图尺寸(百分比表示方式):

#background-size2{ background-size:40% 80%; }

背景图尺寸(等比扩展图片来填满元素,即cover值):

#background-size3{ background-size:cover; }

背景图尺寸(等比缩小图片来适应元素的尺寸,即contain值):

#background-size4{ background-size:contain; }

背景图尺寸(以图片自身大小来填充元素,即auto值):

#background-size5{ background-size:auto; }

mengxin

Meng Xin 网页设计师,文章內容包含WP资源分享、网站前端教程、Html+Css源码、参考文献、【个人原创设计作品】...等,是一個工作達人,更是一個业余钻研者。 | | About me | |

您可能还喜欢...

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注