图片的位置

2016-12-02  本文已影响0人  饥人谷_sunny

在做css这部分网页时发现一个问题,

Paste_Image.png
Paste_Image.png
Paste_Image.png Paste_Image.png
这个时候图片的位置并没有改变
Paste_Image.png Paste_Image.png

这个时候background-position: center; 放在background-position: top; 下面写,图片就会垂直居中

Paste_Image.png Paste_Image.png

**background-position: top; 放在background-position: center; 下面写,图片就会在顶部居中;
**

Paste_Image.png Paste_Image.png

只写个top也会水平顶部居中

Paste_Image.png Paste_Image.png

只写个center会垂直居中

同理,只写个background-position: bottom; 图片会在底部水平居中,连写的方式不论写成background:url() bottom center ;还是background:url()center bottom 图片都会在底部水平居中。
不连写时,backgroun-position: bottom, 放在background-position: center,上面的话,图片会在盒子内垂直居中。

未完成,还待修改补充。。。

上一篇下一篇

猜你喜欢

热点阅读