如何更改ElementUI组件的图标大小以及标签属性

2023-11-12

话不多说,直接上菜。

ElementUI提供的Rate评分组件的默认大小是这样的

图标太小了,想设置宽高、行高、尺寸,但代码不起作用。

打开浏览器调试,发现是用font-size设置才有用。

由此代码存在优先级问题,要提高优先级。

css中使用>>>作深作用选择器:

于是在代码中给el-rate_icon和el-rate__text改变font-size的值就可以了, 要在样式名称前加上/deep/提高优先级。 

这里注意这个class名是组件自带的,不然不会生效。

 所以设置其它ElementUI组件的图标大小以及标签属性也是一样的。

其实还有一些其它方法:

1.直接把<style lang="less" scoped>中的scoped去掉就可以使样式生效,虽简单粗暴但却不是个很好的方法。

2.定义一个全局样式,如global.css,然后在main.js中导入,如此这个样式就全局挂载了,在其中写的自定义样式也会生效。

 描述如有错误,欢迎指正!

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何更改ElementUI组件的图标大小以及标签属性 的相关文章

随机推荐

  • leetcode 3. 最长不含重复的子字符串的五种解法

    leetcode链接 最长不含重复的子字符串 题目描述 给定一个字符串 s 请你找出其中不含有重复字符的 最长子串 的长度 示例 1 输入 s abcabcbb 输出 3 解释 因为无重复字符的最长子串是 abc 所以其长度为 3 示例 2
  • Android优化之启动优化和黑白屏优化

    文章目录 一 启动流程 1 开机启动流程 2 app启动流程 二 启动分类 三 黑白屏优化 1 写一个xml文件 activity welcome 2 welcomeActivity类 四 启动优化 1 获取启动时间 2 启动优化方向 一
  • Linux网络配置不生效

    关于解决Linux网络配置文件 修改不生效问题的解决方案 注意 外部问题 例如虚拟网卡 网段及网卡连通问题另行查找相关解决方案 本博客仅介绍比较生僻的Linux系统配置文件不生效有关问题 先看下产生的问题 修改为静态ip却不生效 我们按照正
  • 解决Echarts中双坐标轴分割错位问题

    1 处理函数 Description 刻度最大值 date 2023 08 30 param any isNaN maxValue 1 returns any export const getYAxisMax maxValue number
  • k8s yaml文件

    简介 YAML IPA j m l 尾音类似camel骆驼 是一个可读性高 用来表达资料序列的编程语言 YAML参考了其他多种语言 包括 XML C语言 Python Perl以及电子邮件格式RFC2822 Clark Evans在2001
  • C++基础之初始化、输入输出安全问题及常量问题

    一 C 统一初始化 初始化列表 解决方案 例1 int main int a 10 int b 10 int c 10 初始化列表 int arr 10 1 2 4 5 6 int brr 10 1 2 3 4 5 6 int crr 1
  • GAMES101回顾 -- Geometry

    Geometry Examples of geometry 隐式几何 Inplict 定义 用函数进行表示 如 f x y z 0 显式几何 Explict 定义 所有点都是直接或通过参数映射给出 所有的 u v 映射到对应的 x y z
  • 【毕业设计】爱琴海——基于HTML5的婚庆用品商城网页设计

    一 内容简介 一 背景与意义 婚俗 是指结婚的风俗 各国各族人民按照自己的习俗 举行各具特色的婚礼 具有各自浓厚的民族独特风采 婚俗元素在是中国婚俗文化的媒介 承载了中华儿女对幸福和吉祥的追求 在中国婚俗文化的发展过程中 婚庆用品设计一直在
  • 题目 2307: 蓝桥杯2019年第十届省赛真题-灵能传输

    题目 在游戏 星际争霸 II 中 高阶圣堂武士作为星灵的重要 AOE 单位 在 游戏的中后期发挥着重要的作用 其技能 灵能风暴 可以消耗大量的灵能对 一片区域内的敌军造成毁灭性的伤害 经常用于对抗人类的生化部队和虫族的 刺蛇飞龙等低血量单位
  • Android卡顿分析中常见的log

    1 看内存 bugreport 开始的时候有pss的信息 并且进行排序 之后会写一个解析和计算的 2 找system log中关键部分 一般设备hang 住的时候用户会疯狂按keycode 可以找相关log keyCode 3 down t
  • 工作与生活如何平衡?

    工作与生活如何平衡 最近忙的有些不像话了 完全没时间可以让自己慢下来思考一些事情 一方面 最近一直感觉自己身体不舒服 一方面 工作上的压力越来越大 要承担的东西也越来越多 生活 发现自己身体体质变差也有一段时间了 从一开始的小腿长时间有酸痛
  • PackageManagerService启动及初始化流程

    PackageManagerService也是有ServerThread启动的 运行在system process进程 我们先来看下PackageManagerService是怎么启动的 PackageManagerService的启动需要
  • 数据结构小白之稀疏数组

    说在前面 这部分笔记是边学习韩顺平老师的图解数据结构与算法边整理出来的 其中也加入了一些拙见 希望2019的暑假可以让自己的编程基础更加扎实 稀疏数组 概念 应用实例 代码 二维数组转稀疏数组 代码 稀疏数组转二维数组 概念 当一个数组中的
  • react 中引入 ant-design

    react 中引入 ant design 一 安装 二 引入 1 全局引入 2 按需加载 手动按需加载 使用 babel plugin import 按需加载 1 运行 npm run eject 暴露出webpack的配置文件 项目会多出
  • 做一个微信小程序的完整流程

    一 引言 最近在帮朋友开发一个小程序 都说今年是小程序快速发展的一年 不懂技术的人 大部分零售店面都开始想做一个小程序帮助推广销售 虽然小程序技术门槛没那么高 但自己独立做一个小程序还是需要了解的内容比较多的 帮朋友做的是一个电商小程序 下
  • android 文件下载

    Download java中放入的是程序的主体 util包中放入的是一些公用的方法 其中FileUtils java放入的是对文件的一些基本操作 HttpDownloader java中是对下载的一些基本操作 第一步 先来看看主程序部分 p
  • 泪目!阿里大佬国庆8天花了50个小时,整理出这份18万字Android-360°性能优化实战解析

    缘起 经过近十年的发展 Android技术优化日新月异 如今Android 10 0 已经发布 Android系统性能也已经非常流畅 可以在体验上完全媲美iOS 到了各大厂商手里 改源码 自定义系统 使得Android原生系统变得鱼龙混杂
  • es AggregationBuilders 聚合查询

    es的聚合查询 聚合的分类 DSL语言实现Bucket聚合 DSL实现Metrics聚合 结合Bucket 在项目中遇到一块关于es的多条件聚合的代码 如下 AggregationBuilders terms agg name field
  • JAVA中String的用法详解

    创建字符串的几种方法 1 直接赋值 String s HelloWord 2 使用构造方法 2 1 根据传入的字符串创建字符串对象 String s new String HelloWord 2 2 根据字符数组创建字符串对象 char v
  • 如何更改ElementUI组件的图标大小以及标签属性

    话不多说 直接上菜 ElementUI提供的Rate评分组件的默认大小是这样的 图标太小了 想设置宽高 行高 尺寸 但代码不起作用 打开浏览器调试 发现是用font size设置才有用 由此代码存在优先级问题 要提高优先级 css中使用 g