手机图像自适应

 

图一

图二

 

实现原理

手机横版图像自适应问题。主要使用样式里面的背景设置来实现。

涉及知识点: 样式

Step by Step

1、打开要插入背景图，添加一个div

2、右键单击div，样式>>布局：布局方式设置为全屏定位。

3、样式>>背景：图片地址设为要添加的图片，尺寸：contain，位置：center，图片重复方式：不重复

最终效果见 图1

注意事项

注意：如果不想留白，将背景>>尺寸里面的 contain 改为 cover 就可以了。如 图2
404 Not Found

404 Not Found

nginx