这两天遇到的问题汇总(一):

1.图片在app端显示有差异:如下

css——手机端图片正确显示                      css——手机端图片正确显示

左边图片是:图片显示太大,以至于让整个页面都失真的效果;右边是调好样式之后的效果,知道增加了一个什么属性不?

...
 <div class="starter-template">
        <h1>{{data.title}}</h1>
        <span class="auth">作者:{{data.author}} &nbsp;&nbsp;&nbsp;{{data.retime}}</span>
        {{#data.content}}
    </div>
...

增加的样式代码:

 .starter-template img {
            max-width: 100%;
            max-height: 100%;
            objec-fit: none;
        }

而神奇的地方就在于object-fit属性,

css——手机端图片正确显示

相关文章: