今天图老师小编要向大家分享个CSS网页设计：百分比进行背景图片定位教程，过程简单易学，相信聪明的你一定能轻松get！
【 tulaoshi.com - Web开发 】
（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）此文为后来的教程做铺垫，转自这儿。百分数定位很有意思，可以实现非凡的效果。
background-position: 50% 20px;之所以不使用
background-position: center 20px;
background-position: 150px 150px;可以看到背景图片的左上角顶点（坐标0,0）定位到了齐容器的中心点（坐标150px,150px）。
background-position: 50% 50%;
看到的并不是如下的效果
而是这样
可见，CSS计算出了背景图片的中心点。这也可以解释为什么我们在使用
background-position: 100% 100%;
定位的时候，图片被放置在容器的右下角，而并没有跑出容器。（如果使用 background-position: 300px 300px; 的话，背景图片会被移出容器）
同样，如果使用
background-position: 20% 20%;
会将背景图片的坐标点(20%,20%)定位到容器的坐标点(20%,20%)。 
来源:https://www.tulaoshi.com/n/20160219/1630196.html
看过《CSS网页设计：百分比进行背景图片定位》的人还看了以下文章 更多>>
