您现在的位置是：首页 > 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返回结果

图文教程

相关源码

(PC+WAP)聚氨酯粉末涂料防腐耐用材料粘合剂网站源码下载为化工涂料企业设计的展示系统，集成产品技术参数库、颜色样板展示器和配方查询模块。支持粉末涂料、环氧树脂等多类产品分类展示查看源码
响应式粉色美容整形化妆品pbootcms网站模板开源源码该网站模板为美容整形、化妆品企业设计，采用响应式布局确保在手机、平板及PC端自动适配显示效果。基于PbootCMS内核开发，支持一键替换图文内容快速转换至其他行业应用。查看源码
(PC+WAP)红色驾校培训学车在线预约源码下载基于PbootCMS内核开发的驾校培训专用网站模板，深度适配驾驶培训行业展示需求。采用PC与移动端同步响应设计，单一后台统一管理内容数据，更换图文素材后可快速转变为其他行业网站。查看源码
(自适应响应式)高端家用办公家具家居桌椅pbootcms模板下载为办公家具企业设计的响应式网站模板，涵盖产品展示、案例呈现、企业介绍等核心模块。通过可视化后台可快速发布实木桌椅、系统家具、办公屏风等产品信息，帮助客户直观了解材质参数与空间搭配方案。查看源码
(自适应)幽默笑话脑筋急转弯搞笑趣图博客pbootcms模板下载本模板基于PbootCMS系统开发，专为幽默笑话、搞笑趣图类网站设计。采用轻松活泼的布局风格，突出娱乐内容分享特色，适合各类笑话、段子、搞笑图片等内容展示。查看源码
(自适应)品牌策划高端设计公司网站pbootcms模板免费下载本模板为品牌策划与设计公司打造，基于PbootCMS内核开发，充分考虑了创意设计行业的视觉展示需求。模板设计风格现代简约，布局合理清晰，呈现设计作品与专业服务，帮助设计公司展示创意实力并吸引潜在客户。查看源码