您现在的位置是：首页 > cms教程 > DedeCMS教程DedeCMS教程

织梦dedecms文章内容页图片自动居中自适应手机的方法

简务2023-09-17DedeCMS教程已有人查阅

导读发表文章时,需要上传图片,很多内容编辑器对图片的处理是居左显示的吧.另外,如果是响应式的HTML5网站,还存在一个图片宽度太宽显示不全的问题.这种情况,在

发表文章时,需要上传图片,很多内容编辑器对图片的处理是居左显示的吧.另外,如果是响应式的HTML5网站,还存在一个图片宽度太宽显示不全的问题.
这种情况,在后台上传图片时,如下图,上传成功后,图片宽度默认是图片的真实宽度,可以把他设置为百%,或留空不填,高度也留空不填.
内容页假如这样写法
<div class="detail"> 这里是内容及图片</div>
cs样式可以如下写法.如果担心在电脑上浏览时,图片过大撑破页面,可以增加一个类似这种样式

.max-width:650px
.detail img{
display:block;margin:0 auto;padding:10px; /* max-width:650px */
}
/*以下为兼容手机代码*/
@media(max-width:760px){
.detail img{max-width: 百%;height: auto;width: auto\9;}
}

本文标签：

很赞哦！ ()

上一篇：织梦后台jpeg格式图片没法上传浏览器中没法查看预览的解决方法

下一篇：dede织梦使用AJAX无刷新提交Form表单PHP返回结果

图文教程

相关源码

(自适应)游泳馆泳池水处理器设备pbootcms网站模板免费下载专注服务于泳池水处理设备制造商、泳池系统工程商等企业用户。模板预设设备分类体系、技术参数展示模块和解决方案呈现页面，满足行业特有展示需求。查看源码
pbootcms源码宠物类网站源码下载(自适应多端)为宠物装备商店、宠物食品及用品企业打造的营销型模板，基于PbootCMS内核深度开发。采用响应式设计实现PC与移动端适配，PHP7.0+高性能架构支持MySQL/SQLite双数据库查看源码
自适应营销型IT网络工作室互联网建站公司pbootcms网站模板为IT网络服务商、建站企业打造的高性能营销门户，基于PbootCMS开源内核深度开发采用HTML5自适应架构，实现PC与手机端数据实时同步交互。查看源码
(PC+WAP)盆栽绿植观赏植物花卉租赁免费pbootcms网站模板为花卉盆栽租赁、园林绿化企业打造的PbootCMS网站模板，采用较新内核开发，PC与移动端数据实时同步。通过清新自然的视觉设计，精准展现植物养护、花卉展示等业务场景，帮助用户快速建立专业级行业网站。查看源码
(自适应)家禽饲养养殖基地pbootcms模板响应式模板下载为家禽饲养企业、养殖基地设计的响应式网站模板，聚焦畜禽产品展示、养殖技术分享及企业信息服务。采用PbootCMS内核开发，响应式技术确保PC与手机端数据实时同步查看源码
(自适应)WordPress主题SEO自媒体博客资讯模板RabbitV2.0Rabbit v2.0主题专注于网站搜索引擎优化需求，为博客、自媒体及资讯类网站提供专业的SEO技术解决方案。该主题从架构设计到功能实现均围绕搜索引擎优化理念展开。查看源码