后台返回的富文本如何能兼容移动端的展示？
后台发布的服务文本，前端通过接口调用展示到pc，手机端，像这种返回的很多，但是因为只兼容pc端，所以同样的富文本 在移动端上展示 会出现左右滑动，或者 格式错位的情况，想问一下有没有办法能让同样的富文本兼容移动端
<html><body>
<p style="text-indent:32.0pt; text-align:justify"><span style="font-family:FangSong"><span style="font-size:10.5pt"><span style="line-height:27.0pt"><span lang="EN-US" style="font-size:16.0pt">11</span><span style="font-size:16.0pt">月24日下午，北海预报减灾中心组织开展年度第三期“青年讲堂”。本期讲堂以“时代各有不同
青春一脉相承”为主题，中心原副总工程师任荣珠和参加中国第13次北冰洋科学考察队员辛若雪担任宣讲嘉宾。中心领导班子及职工代表50余人参加活动。</span></span></span></span></p>
<p style="text-indent:32.0pt; text-align:justify"> </p>
<p style="text-indent:32pt; text-align:center"><img alt="" src="/upload/BContent/2023120110410100 颁发证书.jpg" style="width:477px; height:332px"></p>
<p align="center" style="text-align:center"><span style="font-family:FangSong"><span style="font-size:10.5pt"><span style="font-size:15.0pt">图1 中心领导为青年讲堂宣讲员颁发聘书</span></span></span></p>
<p style="text-indent:32.0pt; text-align:justify"><span style="font-family:FangSong"><span style="font-size:10.5pt"><span style="line-height:27.0pt"><span style="font-size:16.0pt">辛若雪以“一路向北 破浪乘风”为题，讲述了参与中国第13次北冰洋科学考察，随船78天，航行1.5万余海里，完成49个站位作业并首次在我国北冰洋科学考察中成功冲击北极点的精彩故事，表达了新时代新青年不畏艰险、挺膺担当的壮志豪情。</span></span></span></span></p>
<p style="text-indent:32.0pt; text-align:justify"><span style="font-family:FangSong"><span style="font-size:10.5pt"><span style="line-height:27.0pt"><span style="font-size:16.0pt">中心原副总工程师任荣珠参加工作37年，是北海局和中心事业改革发展的亲历者，是中心海洋环境调查与监测工作向海洋生态监测及保护修复升级转型的实践者。刚接到退休通知的她满含不舍之情回溯发展历史，对深耕多年的工作领域提出中肯建议，勉励中心青年要永葆初心、不负韶华，寄语中心事业发展行稳致远、再续新篇。</span></span></span></span></p>
<p style="text-indent:32.0pt; text-align:justify"><span style="font-family:FangSong"><span style="font-size:10.5pt"><span style="line-height:27.0pt"><span style="font-size:16.0pt">中心领导号召中心职工，要继续传承“严谨务实、团结协作、敬业规范、高效服务”的工作作风，脚踏实地、接续奋斗，紧抓中心改革发展契机，坚守新时期新使命，走好新时代长征路。</span></span></span></span></p>
<p style="text-indent:32pt; text-align:center"><span style="font-family:FangSong"><span style="font-size:10.5pt"><span style="line-height:27.0pt"><span style="font-size:16.0pt"><img alt="" src="/upload/BContent/2023120110293802.中国第13次北冰洋科学考察队员辛若雪宣讲.bmp" style="width:580px; height:415px"></span></span></span></span></p>
<p style="text-indent:32pt; text-align:center"><span style="font-family:FangSong"><span style="font-size:15.0pt">图2 中国第13次北冰洋科学考察队员辛若雪</span><span style="font-size:15.0pt">宣讲</span></span></p>
<p style="text-indent:32pt; text-align:center"> </p>
<p style="text-indent:32pt; text-align:center"><span style="font-family:FangSong"><span style="font-size:15.0pt"><img alt="" src="/upload/BContent/2023120110301803.中心原副总工程师任荣珠宣讲.bmp" style="width:580px; height:396px"></span></span></p>
<p align="center" style="text-align:center"><span style="font-family:FangSong"><span style="font-size:10.5pt"><span style="font-size:15.0pt">图3 中心原副总工程师任荣珠宣讲</span></span></span></p>
<p align="center" style="text-align:center"> </p>
<p align="center" style="text-align:center"><span style="font-family:FangSong"><span style="font-size:10.5pt"><span style="font-size:15.0pt"><img alt="" src="/upload/BContent/2023120110310204.全体参会人员合影.bmp" style="width:680px; height:383px"></span></span></span></p>
<p align="center" style="text-align:center; text-indent:30.0pt"><span style="font-size:10.5pt"><span style="line-height:27.0pt"><span style="font-family:"Calibri","sans-serif""><span style="font-size:15.0pt"><span style="font-family:仿宋">图4 全体参会人员合影</span></span></span></span></span></p>
<p align="center" style="text-align:center; text-indent:30.0pt"> </p>
<p style="text-indent:28.0pt; text-align:justify"><span style="font-size:10.5pt"><span style="line-height:27.0pt"><span style="font-family:"Calibri","sans-serif""><span style="font-size:14.0pt"><span style="font-family:幼圆">北海预报减灾中心“青年讲堂”成立于2015年，目前初步形成“精英沙龙”“中心故事荟”“智慧课堂”三个子品牌。“青年讲堂”致力于为青年搭建平台、请青年走上讲台，已成为联系青年、服务青年、凝聚青年的有力抓手。</span></span></span></span></span></p>
<p style="text-indent:32pt; text-align:right"><span style="font-size:10.5pt"><span style="line-height:27.0pt"><span style="font-family:"Calibri","sans-serif""><span style="font-size:16.0pt"><span style="font-family:仿宋">（图、文 北海预报减灾中心）</span></span></span></span></span></p>
<p style="text-indent:32.0pt; text-align:justify"> </p>
</body>
</html>
尝试过在外面包裹div 加样式 但是效果不是特别好
回答：
没有很好的办法，所以我一般都建议不用或者少用富文本编辑器。
如果确实有移动端需求，可以削减一些功能，比如只能用 <h1>，<h2>，之类的标准文本格式标签。
回答：
我一般都是css控制，.xx *{字体大小间距什么的 !important;}
img设置max-width:100%;或者直接width:100%;
回答：
外面包一层 DIV，设置宽度（和桌面页面的设计尺寸宽度一致）
然后 css zoom:xx% ，具体 百分比数值 可以通过 js 计算
这样的话，逻辑上每行的字都一样多，行数也一样
差别可能是上下的文字字体大小比例两边可能会有明显差异
另外不排除 桌面和手机端 字体不同引起的小差异
以上是 后台返回的富文本如何能兼容移动端的展示？ 的全部内容， 来源链接： utcz.com/p/935215.html
