uni-app如何使用vant-ui如何改变样式

╰半橙微兮° 2023-03-02 10:12 54阅读 0赞

## 举例: ##

NoticeBar 通告栏组件 需要更改背景颜色及字体颜色  
原本:  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDk0MzI2OA_size_16_color_FFFFFF_t_70]  
更改后:  
![在这里插入图片描述][20200728165949463.png]  
改成了白色背景和红色文字

实现:  
![在这里插入图片描述][20200728170057311.png]  
在组件使用代码上添加一个类  
![在这里插入图片描述][2020072817013427.png]  
".van-notice-bar\_\_content"如何拿到?  
![在这里插入图片描述][20200728170300128.png]  
![在这里插入图片描述][20200728170243981.png]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDk0MzI2OA_size_16_color_FFFFFF_t_70]: /images/20230208/21501db9ca9c47ca94a78ae1344ce0c0.png
[20200728165949463.png]: /images/20230208/31ee4141bc2842ce8a062d55014651a6.png
[20200728170057311.png]: /images/20230208/18a9e330305a48069c43970a8776160a.png
[2020072817013427.png]: /images/20230208/592aeeb4311645a5b9f1305e80e1f788.png
[20200728170300128.png]: /images/20230208/37523ffc5bce48f6b8d44211257807af.png
[20200728170243981.png]: /images/20230208/808e70ebd39a4b2b9eb76ad5b11742c5.png

发表评论取消回复

表情：

评论列表（有 0 条评论，54人围观）

还没有评论，来说两句吧...

相关阅读

相关 uniapp如何配置使用uView

uniapp使用uView教程

女爷i/ 2024年04月20日 22:13/ 0 赞/ 83 阅读

相关如何使用 CSS 设置样式

CSS（层叠样式表）是一种用于控制网页样式和布局的标记语言。通过使用 CSS，您可以选择性地应用样式和布局规则，以改变 HTML 元素的外观和行为。本文将向您介绍如何使用 CS

怼烎@/ 2023年10月16日 14:57/ 0 赞/ 20 阅读

相关 CSS中如何改变鼠标指针样式（cursor）？

聚沙成塔·每天进步一点点 ⭐ 专栏简介 ⭐ CSS中改变鼠标指针样式（cursor） ⭐ 示例： ⭐ 写在最后 ----------------

柔光的暖阳◎/ 2023年10月15日 10:03/ 0 赞/ 46 阅读

相关 uni-app如何使用vant-ui如何改变样式

举例: NoticeBar 通告栏组件需要更改背景颜色及字体颜色原本: ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGV

╰半橙微兮°/ 2023年03月02日 10:12/ 0 赞/ 55 阅读

相关 uniapp项目如何使用字体图标

第一步，把font文件放到static文件夹下 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9

快来打我*/ 2022年10月23日 11:12/ 0 赞/ 290 阅读

相关如何使用JS来改变CSS样式

方法: document.getElementById("xx").style.xxx中的所有属性是什么 <table style="margin:0px; pad

电玩女神/ 2022年09月24日 12:18/ 0 赞/ 226 阅读

相关如何用css样式改变下拉菜单的样式？

敲下如下代码： <select> <option>option1</option> <option>option2</option>

Myth丶恋晨/ 2022年09月21日 04:57/ 0 赞/ 466 阅读

相关如何改变默认的checkbox样式

我们在项目中使用到input标签的checkbox的时候，它的默认样式通常无法满足项目需求，主要是它显得有点小而丑。将它根据项目的需求进行改造就是我们要做的事情了，下面讲两种

今天药忘吃喽~/ 2022年06月13日 13:28/ 0 赞/ 716 阅读

相关 uniapp - uniapp 中的样式使用

uniapp 中的样式使用一. 尺寸单位二. 样式导入三. 内联样式四. 选择器五. 全局样式与局部样式 > 在 uni-app

╰+哭是因爲堅強的太久メ/ 2021年07月26日 02:42/ 0 赞/ 947 阅读

相关如何利用css改变浏览器滚动条样式

注意：该方法只适用于 -webkit- 内核浏览器滚动条外观由两部分组成： 1、滚动条整体滑轨 2、滚动条滑轨内滑块在CSS中滚动条由3部分组成

朱雀/ 2020年04月28日 06:05/ 0 赞/ 1067 阅读