css 背景测试

css3难度不大,就是细节比较,需要一 一测试,你不测试,你就是搞不定

也就是说,默认的话,背景颜色,或者背景图片,从padding-box 开始!

这是第一个需要测试的!图片作为背景也一样:


若图片的大小,超出padding-box 的大小,那么图片只会显示一部分,从图片的左上角开始显示,不会自动的缩放!

若图片的大小小于Padding-box 的大小,则会进行平铺操作!

我们把背景变成小图片,则默认平铺!


下面我们来介绍一下,background-position ,这个需要详细介绍下,大家不要着急, 前端,没含量,但是需要耐心测!

显示效果:

基本原理就是,若background-position 指定一个值,该值将做为背景图的横轴坐标

y 轴坐标为50% 50% 的概念是,(paddingbox 的高度- 图片的高度) * 50% 作为背景图片的起点的Y轴坐标!


当然也可以指定


这一小节,我们就先讲到这,三个css2 的背景属性的理解! 下一节我们讲css3 新增的背景属性

猜你喜欢

转载自blog.csdn.net/qq_15009739/article/details/86804662