1***@qq.com
1***@qq.com
  • 发布:2023-05-14 16:46
  • 更新:2023-05-14 16:46
  • 阅读:204

【报Bug】uniapp写的全局覆盖样式中,使用标签选择器会被转成类选择器

分类:uni-app

产品分类: uniapp/小程序/抖音

PC开发环境操作系统: Windows

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

HBuilderX类型: 正式

HBuilderX版本号: 3.7.11

第三方开发者工具版本号: 4.0.7

基础库版本号: 2.85.0.2

项目创建方式: HBuilderX

操作步骤:

<style lang="scss">

/app.ttss/
/ @import './assets//font/font.ttss'; /
.container {
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
padding: 200rpx 0;
box-sizing: border-box;
}
page {
font-family: Monospaced Number, Chinese Quote, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica,
Arial, sans-serif !important;
--parColor: #7ce3c0;
/ 底部导航的颜色需要单独设置 /
--parGradColor: #89e6c6;
}
p,span{
margin: 0;
font-size: 14px;

}
</style>

预期结果:

@charset "UTF-8";
/**

  • 这里是uni-app内置的常用样式变量
  • uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  • 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  • */
    /**

  • 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  • 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
    /
    /
    颜色变量 /
    /
    行为相关颜色 /
    /
    文字基本颜色 /
    /
    背景颜色 /
    /
    边框颜色 /
    /
    尺寸变量 /
    /
    文字尺寸 /
    /
    图片尺寸 /
    /
    Border Radius /
    /
    水平间距 /
    /
    垂直间距 /
    /
    透明度 /
    /
    文章场景相关 /
    /app.ttss/
    /
    @import './assets//font/font.ttss'; /
    .container {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 200rpx 0;
    box-sizing: border-box;
    }
    page {
    font-family: Monospaced Number, Chinese Quote, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif !important;
    --parColor: #7ce3c0;
    /
    底部导航的颜色需要单独设置 */
    --parGradColor: #89e6c6;
    }
    p, span {
    margin: 0;
    font-size: 14px;
    }

实际结果:

@charset "UTF-8";
/**

  • 这里是uni-app内置的常用样式变量
  • uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  • 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  • */
    /**

  • 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  • 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
    /
    /
    颜色变量 /
    /
    行为相关颜色 /
    /
    文字基本颜色 /
    /
    背景颜色 /
    /
    边框颜色 /
    /
    尺寸变量 /
    /
    文字尺寸 /
    /
    图片尺寸 /
    /
    Border Radius /
    /
    水平间距 /
    /
    垂直间距 /
    /
    透明度 /
    /
    文章场景相关 /
    /app.ttss/
    /
    @import './assets//font/font.ttss'; /
    .container {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 200rpx 0;
    box-sizing: border-box;
    }
    page {
    font-family: Monospaced Number, Chinese Quote, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif !important;
    --parColor: #7ce3c0;
    /
    底部导航的颜色需要单独设置 */
    --parGradColor: #89e6c6;
    }
    ._p, ._span {
    margin: 0;
    font-size: 14px;
    }

bug描述:

在uni的App.vue中写全局样式,例如p标签,一键打包成小程序的时候,会将代码转化成类导致全局覆盖的样式失效

2023-05-14 16:46 负责人:无 分享
已邀请:

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