ueditor内容在app中展示的格式问题

最新推荐文章于 2024-11-11 19:15:08 发布

原创最新推荐文章于 2024-11-11 19:15:08 发布 · 1.4k 阅读

0 ·

CC 4.0 BY-SA版权

java 专栏收录该内容

35 篇文章

订阅专栏

本文介绍了解决UEditor在移动端展示时无法全屏显示的问题，通过调整HTML和CSS实现图片、视频等内容在手机上的良好展示效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ueditor可以上传图片、视频、iframe,在手机上展示时，不能铺满全屏，后台处理这种问题的解决步骤：

1、用获取的ueditor的内容替换下面代码中的#content，将h5页面返给app,注意去掉空格和换行

<!DOCTYPE html>
	<html lang="zh-CN">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<link rel="stylesheet" href="http://公网ip/pic/file/h5.css" />
	</head>
	<body>
		#content
	</body>
</html>

2、在css中控制元素的格式,css放到公网ip上，在app端也可以调用，pic是server中配置的一个路径，css代码如下

html,body{
	height:100%;
	width:100%;
	padding:0;
	margin:0;
}
#content{
	width:90%;
	height:100%;
	padding:0;
	margin:10px auto;
}
iframe {
	width:100% !important;
	height:auto;
	
}
img { width:100%;}
video {
	width:100%;
	height:100%;
}