您现在的位置是：首页 > 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模板下载该模板适用于品牌策划、艺术设计、广告创意公司官网，亦可通过替换图文快速适配其他行；高端创意设计公司工作室网站源码极简代码架构、艺术化视觉布局、企业级功能扩展性。查看源码
(自适应响应式)HTML5建筑工程公司建筑集团网站模板下载基于PbootCMS内核开发的响应式建筑行业网站模板，为建筑工程公司、建筑集团等企业打造，通过简洁大气的设计风格展现企业专业形象。查看源码
(自适应响应式)超市仓储仓库货架展架网站pbootcms源码下载本模板为货架展架、仓储货架行业量身打造，采用PbootCMS内核开发，充分考虑了货架产品展示和企业形象展示的需求。模板设计简洁大方，突出产品特点，能够有效展示各类货架产品的规格参数和应用场景，帮助访客快速了解企业核心业务和产品优势。查看源码
(自适应响应式)AI智能电子科技产品pbootcms网站模板下载基于PbootCMS内核的响应式模板，为AI智能硬件、电子产品等科技企业打造，通过技术创新实现品牌数字化升级。查看源码
(自适应)互联网建站网络公司个人工作室网站模板基于PbootCMS内核开发，围绕「技术方案展示」「成功案例库」「服务流程说明」三大模块构建，支持PC与移动端数据实时同步。附带包含客户评价、行业解决方案的完整测试数据包查看源码