码迷,mamicode.com
首页 > Web开发 > 详细

html5——背景

时间:2017-12-19 12:27:08      阅读:190      评论:0      收藏:0      [点我收藏+]

标签:裁剪   tom   比例   style   html5   top   enter   blog   pad   

背景大小

background-size: 50% 50%;//宽 高
background-size: 100px 100px;//宽 高
background-size: cover;//覆盖,图片会完全覆盖盒子,有可能显示不完整,缩放是等比例的
background-size: contain;//包含,背景图片会完全等比例,显示盒子中,有可能不会铺满盒子

背景裁剪

background-origin: border-box;//设置背景原点为border-box
background-clip:content-box;//只显示content区域

backgrond-clip:1、border-box    2、padding-box(默认padding)    3、content-box

多背景图片

background: url(images/bg1.png) no-repeat left top,
url(images/bg2.png) no-repeat right top,
url(images/bg4.png) no-repeat left bottom,
url(images/bg3.png) no-repeat right bottom,
url(images/bg5.png) no-repeat center center;

 

html5——背景

标签:裁剪   tom   比例   style   html5   top   enter   blog   pad   

原文地址:http://www.cnblogs.com/wuqiuxue/p/8064350.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!