Web组件展示页面片,h5内容会超出Web组件宽度
使用Web组件展示HTML标签富文本,h5内容宽度超出了Web组件限制的宽度,导致页面右边内容显示不全,且会左右滑动。
页面片内容:
export const HTMLRichTextTemplate = `
<!DOCTYPE html>
<html>
<head>
<title>Rich_Text</title>
<style>
html {
-webkit-text-size-adjust: 100%;
text-align: right;
}
div {
font-size: 15px;
color: #666666;
}
a {
color: #3389DF;
text-decoration: none;
}
span {
color: #333333;
}
strong {
color: #000000;
}
</style>
</head>
<body>
<div class='container'>
<font color='#DF1F26'>05月22日</font>
</div>
</body>
</html>
加载页面片的代码:
Web({
src: '',
controller: this.webController
})
.height(this.webHeight)
.horizontalScrollBarAccess(false)
.textZoomRatio(fp2px(100))
.zoomAccess(false)
.width('60%')
上述的代码中, Web组件的.width设置为 70% 或更大时,才不会出现h5内容宽度超过Web组件的情况;小于70% 都会出现标题描述的问题。
HarmonyOS
赞
收藏 0
回答 1
待解决
相关问题
HarmonyOS web组件加载h5,h5拉起摄像头
385浏览 • 1回复 待解决
HarmonyOS Web组件加载在线H5页面
52浏览 • 1回复 待解决
Web组件和h5页面如何交互?
71浏览 • 1回复 待解决
HarmonyOS web组件H5页面如何选择手机图片视频
286浏览 • 1回复 待解决
H5中的图片在Web组件中显示异常
60浏览 • 1回复 待解决
HarmonyOS web折叠屏展示h5页面进入时会放大
333浏览 • 1回复 待解决
如何设置Web组件加载的H5页面禁用手势缩放
2224浏览 • 1回复 待解决
HarmonyOS web与H5交互
450浏览 • 1回复 待解决
在Web组件的H5页面中,如何使用a标签实现打开各种页面
1890浏览 • 1回复 待解决
怎么禁止Web组件加载的H5页面长按复制粘贴功能?
53浏览 • 1回复 待解决
Web中webview和H5交互
947浏览 • 1回复 待解决
HarmonyOS 如何清理Web组件h5往localStorage写的数据
336浏览 • 1回复 待解决
HarmonyOS web通过loadData加载h5标签
38浏览 • 1回复 待解决
HarmonyOS web原生和H5如何交互?
377浏览 • 1回复 待解决
HarmonyOS原生中的web组件如何和组件内渲染的h5进行通信
244浏览 • 1回复 待解决
当子组件的宽度大于父组件的宽度,UI会怎样展示?
390浏览 • 1回复 待解决
Web组件对原生H5、常用框架VUE、React的页面支持情况,包括本地和网络端的页面
1798浏览 • 1回复 待解决
HarmonyOS web与H5两端数据交互
550浏览 • 1回复 待解决
HarmonyOS Web组件加载的h5网页如何获取到网页的window对象?
69浏览 • 1回复 待解决
HarmonyOS Web组件是否支持修改在线h5网页的请求头
280浏览 • 1回复 待解决
Web能直接加载h5代码吗?
2933浏览 • 2回复 待解决
web控件加载h5, h5里的javascript打印的console.info在哪里看?
1886浏览 • 1回复 待解决
HarmonyOS Web组件加载VUE3打包的H5资源白屏无法显示
324浏览 • 1回复 待解决
HarmonyOS Web组件高度设置问题,Web组件内容被遮挡
47浏览 • 1回复 待解决
设置子组件的宽度不超出父组件
432浏览 • 1回复 待解决
给html设置<meta name="viewport" content="width=device-width, initial-scale=1.0">即可。