网站开发工具 知乎,网站开发技术视频,ui设计培训学费多少,多用户商城 源码问题#xff1a;在浏览器页面退出登录按钮上“退出登录”字样消失#xff0c;而在手机端页面正常;通过查看浏览器页面的HTML代码#xff0c;发现有“退出登录”这几个字#xff0c;只不过由于样式问题#xff0c;这几个字被挤到看不见了。
样式代码中有一行为#xff1a…问题在浏览器页面退出登录按钮上“退出登录”字样消失而在手机端页面正常;通过查看浏览器页面的HTML代码发现有“退出登录”这几个字只不过由于样式问题这几个字被挤到看不见了。
样式代码中有一行为width: 750rpx
.fixed-bottom {position: fixed;bottom: 160rpx;width: 750rpx;display: flex;justify-content: center;align-items: center;overflow: hidden;height: var(--fixedBottomHeight);background-color: $uni-bg-color;} 原因 官方文档 rpx 即响应式px是一种根据屏幕宽度自适应的动态单位。uni-app规定屏幕的基准宽度为750rpx750rpx就是屏幕最大宽度样式宽度不能超过750rpx。 但rpx不支持web网页仅支持小程序。究其根本就是web和小程序样式的兼容问题。 各单位区别如下
单位名称说明web小程序px绝对单位。代表像素数量支持支持em相对单位。相对于父元素的字体大小支持支持rem相对单位。相对于页面根标签 html 的字体大小支持不支持vw相对单位。相对于视口的宽度大小 100vw 等于视口的宽度支持支持rpx相对单位。 小程序中独有 750rpx 等于视口的宽度不支持支持
解决 由上表可看出vw既支持web又支持小程序因此这里可使用width 100vw;的样式来替换。
