关于移动端的九宫格布局问题（没有用ui框架写，是写小程序的）

Question

第一疑问：

我在做一个类似朋友圈的功能，当它只有一张图片时，
我会直接按照它图片的原本尺寸直接放上去，导致图片拉伸模糊，
例如我有一张1080x2160的图片，我压缩后还有316x512,我直接放
上去图片的显示就会不完整，效果如下  

但我想要的是类似这图片中的长图片的效果

请问这怎么设置，平时很少做移动端，比较笨

第二疑问：

这九宫格只有这一张图片时，应该是要设置最大的高度，但设置了后，
图片的高度会大过你的最大高度，这是会截取，但不想截取，能否可以
将图片全部显示出来，等比例缩放吗？

Answer 1

尺寸设置为:

max-width: 100%;
max-height: 100%;

或者用background-iamge,通过backgroun-size关键字控制