【问题标题】:Image Size for Mobile - WordPress移动图像大小 - WordPress
【发布时间】:2015-09-14 17:24:36
【问题描述】:

从移动设备查看时,我对以下链接有疑问。 http://www.empowerhealthconcepts.com.au/rubix-plyometrics/

像下面这样的所有其他链接,例如图像大小在移动视图上都可以。 http://www.empowerhealthconcepts.com.au/chronic-disease-management-and-prevention/

唯一的区别是,对于 Rubix Plyometrics 页面,我在图像上添加了一个类来居中、隔开它们并将它们分开。

班级是:

.rubiximage {
margin-left: 105px;
width: 21% !important;
}

如果我没有将宽度设置为 21%,则图像在移动视图上会被截断。 但是当我放 21% 时,图像在移动视图上显得太小了。

有什么建议吗?

【问题讨论】:

    标签: css wordpress mobile


    【解决方案1】:

    删除您的代码并使用它:

    .rubiximage {
        float: left;
        max-width: 270px;
        width: 100%;
    }
    .entry-content p:first-child{
        display: inline-block;
    }

    应该是 100%,而不是 50% 宽度,但是您的图像太小,如果您使用 100%,它们看起来会像素化。

    【讨论】:

    • 不幸的是,使用该 CSS 会使我的图像变得很大,并阻止它们像现在那样排成一行
    • 然后去掉 width: 50% 并使用 float left。
    • 因为它们的大小,它们不在同一条线上,你说它们看起来很小。如果您希望它们在移动设备上看起来不错,它们会以一定的分辨率破裂。请参阅我的更新答案。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2018-06-24
    • 2011-08-25
    • 1970-01-01
    • 2020-07-15
    • 2016-07-26
    • 1970-01-01
    • 2015-11-08
    相关资源
    最近更新 更多