我正在为wordpress构建自定义主题, 它说在wordpress 4.4+之后, 响应图像已内置到wordpress核心中, 但我的图像没有响应。我已经清除了缓存并在手机上进行了尝试, 但是仍然无法正常工作。
这是我拍摄图像的步骤：
在帖子图片中：
- 添加媒体
- 选择原尺寸并插入帖子
- 检查检查元素：这是代码…
<
img class="size-full wp-image-28" src="https://www.example.com/wp-content/uploads/2017/07/picture1.jpg" width="1000" height="667" srcset="https://www.example.com/wp-content/uploads/2017/07/picture1.jpg 1000w, https://www.example.com/wp-content/uploads/2017/07/picture1.jpg 600w, https://www.example.com/wp-content/uploads/2017/07/picture1.jpg 768w, https://www.example.com/wp-content/uploads/2017/07/picture1.jpg 30w" sizes="(max-width: 1000px) 100vw, 1000px">
#1使用width：100％和max-width：100％使其具有响应性, 由于图像具有height和width属性, 因此现在不响应。如果你只需要将图像变为响应图像, 请使用自动生成的类wp-image-28。
【WordPress响应式图像不起作用】CSS部分喜欢
img.size-full {
width:100% !important;
max-width:100% !important;
}
OR
img.size-full.wp-image-28 {
width:100% !important;
max-width:100% !important;
}
#2
@media only screen and (max-width: 1023px){
.entry-content img{
max-width:50%;
}
}
使用此功能有效, 但如果标题较长, 仍会弄乱图像周围的填充/边距。
推荐阅读
- WordPress-找不到请求的URL
- wordpress用随机字符替换单引号
- WordPress渲染的CSS与CSS文件不匹配
- WordPress Redux Framework-插件中无法访问全局opt_name
- WordPress相关文章缩略图可以工作，但永久链接错误
- 持续交付之基于YouTrack的产品看板驱动
- 介绍并配置Dynamics 365中的虚拟实体Virtual Entity
- Android 应用技巧（ 手把手教你 优雅实现 “一键退出 App”）
- Linux 中僵尸进程详解