zoukankan      html  css  js  c++  java
  • 织梦手机端内容页图片不能自适应的解决办法!

    最近在优化运营网站的时候,发现了一个问题:织梦DedeCMS响应式模板,手机端文章内容页图片不能自适应!这给通过手机端浏览网站的用户造成了很不好的用户体验,所以,必须要整改。今天就给大家介绍一下“织梦DedeCMS手机端文章内容页图片不能自适应的解决办法!”,希望对大家有帮助!

    之前做网站的时候,考虑到移动流量占比会越来越大的因素,我采用了响应式模板。这样一套模板下来,既有了pc站也有了手机站,省去了后期单独建手机站的麻烦。在对模板进行大量的修改和优化后,网站正式上线了。在后期的运营过程中,才发现了手机端内容页图片不能自适应的问题。

    当时我通过手机端去浏览网站的收录情况,点击进去后发现图片只显示了一部分,另一部分被隐藏掉了。本来一张好好的图片,只显示一半,在视觉上造成了很差的用户体验。为了解决这个问题,我查了很多资料,并最终完美的解决了该问题。大量的资料表明,手机端图片不能自适应,主要的原因在于css样式上。一般来说,前端设计模板的时候会给图片设置固定的宽、高,这个宽高往往是针对电脑屏幕设计的。但是,手机显示屏远远小于电脑屏幕,一旦图片宽高固定且图片宽高大于手机显示屏的话,就会出现手机端只显示图片一部分的情况。

    解决这个问题,只要能够做到让文章内容页图片跟随显示设备屏幕的大小变化,自动等比缩放即可。让图片在手机端的宽度显示100%,高度自动缩放则可完美解决这个问题。具体代码如下:

    假如你的文章内容页图片节点如下:

    找到图片节点对图片样式进行修改。 .test img{ 100% ; height:auto !important;}把这段css放到样式表中,就完美的解决了织梦DedeCMS手机端文章内容页图片不能自适应的问题。

    以上是对“织梦DedeCMS手机端文章内容页图片不能自适应的解决办法!”的相关介绍,这是本人亲测、完全可行的方法。如果你的手机站图片不能自适应,可以尝试这种方法自行解决问题。

  • 相关阅读:
    Multipatch的Z值单位问题(三维坐标系和三维坐标转换,极坐标)
    ArcGIS城市地下管网纵横断面分析设计与实现&三维分析之DEM横断面 纵断面 剖面
    ArcScene按照属性进行拉伸Extrusion
    Python 字符串长度和字符串截取函数
    ArcGIS中Interpolater Polygon to Multipatch(3D)用法及原理——多边形转面片
    arcgis删除重复的线段
    ArcGIS如何判断直线图层的两个端点的编码是否与点图层的Name字段是否相等?
    使用ArcEngine创建Multipatch图形
    ArcGIS和VB联合开发
    ArcGIS根据属性创建3D对象
  • 原文地址:https://www.cnblogs.com/ytweb/p/14962953.html
Copyright © 2011-2022 走看看