您现在的位置是：首页 > 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+WAP)APP应用软件下载类官网源码为APP应用软件官网打造的响应式解决方案，PC端与移动端(WAP)数据实时同步，一次更新全网生效，满足多终端用户无缝体验需求。查看源码
帝国cms7.5女性护肤搭配美妆潮流网站源码带数据4.5G本模板专为女性美容护肤行业设计，提供美容护肤、发型设计、女性健康、时尚化妆、娱乐新闻、服饰搭配等女性潮流资讯内容展示。采用帝国CMS7.5开发，同步生成电脑端和手机端，满足用户对美容时尚信息的获取需求。查看源码
(自适应)html5导航目录索引工具类网站源码下载本模板基于PbootCMS开发，为站长导航、网址导航类网站设计。采用HTML5+CSS3技术构建，适配PC端和移动端，提供流畅的浏览体验。适用于个人站长、资源导航平台等场景查看源码
(自适应)大型农业机械设备水稻玉米收割机网站pbootcms源码下载本模板基于PbootCMS内核开发，为农业机械设备制造与销售企业设计，特别适合水稻玉米收割机、拖拉机、播种机等农用机械展示。模板充分考虑了农机行业的特性，从产品展示到技术参数，从作业案例到售后服务查看源码
(自适应响应式)HTML5甲醛环境检测网站模板带在线留言和资料下载本模板为甲醛检测与环保科技企业开发，采用PbootCMS内核构建。首页集成空气质量数据可视化模块，服务流程采用时间轴展示设计，检测报告板块支持PDF在线预览功能查看源码