1***@qq.com
1***@qq.com
  • 发布:2021-06-17 17:06
  • 更新:2021-12-12 19:59
  • 阅读:1226

【报Bug】在nvue页面和vue页面中 设置相同大小的字体,但是手机端显示一大一小

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: 6.1

HBuilderX类型: 正式

HBuilderX版本号: 3.1.18

手机系统: Android

手机系统版本号: Android 10

手机厂商: 华为

手机机型: pot-al00a

页面类型: nvue

打包方式: 云端

项目创建方式: HBuilderX

操作步骤:

1.编写组件。
2.引入组件,操作查看效果
3.发现在nvue页面中字体大小所占位置与vue页面中不同

预期结果:

发现在nvue页面中字体大小所占位置与vue页面中相同

实际结果:

发现在nvue页面中字体大小所占位置与vue页面中不同

bug描述:

在nvue页面和vue页面中 设置相同大小的字体,但是手机端显示一大一小

.tabbar_label {
color: rgb(142, 142, 147);
font-size: 13px;

<text class="tabbar_label" :class="{'active': item.id == pageIndex}">{{item.text}}</text>

2021-06-17 17:06 负责人:无 分享
已邀请:
1***@qq.com

1***@qq.com (作者) - 一个懒的前端猿

1***@qq.com

1***@qq.com (作者) - 一个懒的前端猿


这是在vue页面显示的效果,上一张是在nvue页面显示的效果

1***@qq.com

1***@qq.com

用rpx响应式单位,不要用像素单位
https://uniapp.dcloud.io/frame?id=%e5%b0%ba%e5%af%b8%e5%8d%95%e4%bd%8d

  • 1***@qq.com (作者)

    一样文字上下空隙不一样

    2021-06-17 17:24

  • 1***@qq.com

    回复 1***@qq.com: vue页面text组件是有默认行高的,nvue页面text是包裹文字的,你可以设置相同的行高

    2021-06-17 17:45

  • 1***@qq.com (作者)

    回复 1***@qq.com: 还是一样的

    2021-06-17 17:58

1***@qq.com

1***@qq.com

坑确实很多

该问题目前已经被锁定, 无法添加新回复

  • 标题 / 粗斜体
  • 代码片段
  • 超链接 / 图片 / 视频
  • 列表 / 引用

文章内容较多时,可以用标题分段 :

## 大标题 
### 小标题

斜体 / 粗体 :

**粗体** 
*斜体*
***粗斜体***

代码片段 :

``` javascript
代码片段
```

超链接 :

[链接文字](链接地址) 例: [百度](http://www.baidu.com)

图片 :

![图片说明](图片地址) 例: ![百度logo](http://www.baidu.com/img/bdlogo.gif)

视频 :

!![视频说明](视频地址) 例: !![优酷视频](http://youku.com)

有序列表 :

1. 123
2. 123
3. 123

无序列表 :

- 123
- 123
- 123

引用 : ( 双回车后结束引用 )

> 引用内容
引用内容
引用内容