写小程序组件 需要修改vant里面的组件的样式,发现居然里面自带了important 所以试了一些方法顶掉important

研究了下css的important规则,发现多个important也是有层级关系的

<style>.div1{height: 50px !important;width: 100%;border: 2px solid red;}.box .div1{height: 100px !important;}
</style>
<body><div class="box"><div class="div1"></div></div>
</body>

参考: https://www.runoob.com/css/css-important.html

important有几个注意的点

  1. 一定要优先考虑使用样式规则的优先级来解决问题而不是 !important

  2. 只有在需要覆盖全站或外部 CSS 的特定页面中使用 !important

  3. 永远不要在你的插件中使用 !important

  4. 永远不要在全站范围的 CSS 代码中使用 !important

css样式顶掉important和important的使用注意点相关推荐

  1. css样式优先级机制

    对css选择器不熟悉的建议先看看w3school 一.权值不同时 样式类型 权重值 style内联样式(标签内部) 1000 ID选择器 0100 类选择器,属性选择器,伪类 0010 元素选择器,伪 ...

  2. css样式让样式失效,如何让css样式失效

    让css样式失效的方法:1.通过更改元素名称,来达到让此区域css失效的目的:2.通过设置优先级高的css样式来覆盖此css样式使其失效. 本教程操作环境:windows7系统.css3版,DELL ...

  3. css样式的优先顺序

    本文转载于:猿2048网站https://www.mk2048.com/blog/blog.php?id=caj1j&title=css%E6%A0%B7%E5%BC%8F%E7%9A%84% ...

  4. css !important用法以及CSS样式使用优先级判断

    之前一直看到很多css中都有!important这个样式,一直不知道有什么作用的,今天在网上详细了解了一下,看了别人的博客,顺便转载收藏一下 css !important用法CSS样式使用优先级判断 ...

  5. JS设置CSS样式的几种方式(js设置!important)

    JS设置CSS样式的几种方式(js设置!important) x619y 用JS来动态设置CSS样式,常见的有以下几种 1. 直接设置style的属性  某些情况用这个设置 !important值无效 ...

  6. jQuery修改!important的css样式jQuery修改css未生效

    当我们使用jQuery修改带有!important的css样式或者jQuerycss样式未生效可尝试以下解决办法 1.解决办法 原有代码: <!DOCTYPE html> <html ...

  7. CSS样式属性(一)

    字体样式 font-size:字号大小 font-size属性 设置字号 该属性的值可以使用相对长度单位 也可以使用绝对长度单位 其中相对长度单位比较常用 推荐使用px像素单位 相对长度单位 说明 e ...

  8. uniapp怎么引入css_uniapp - css样式设置scoped

    1.App.vue(样式层级高)定义样式就可以覆盖子组件或者父组件,无论有没有设置scoped关键字 export default { onLaunch: function() { console.l ...

  9. (5)css样式表特征

    浏览器控制面板介绍 一.css继承性 CSS 的概念中,除了前面提到的样式外,还有一个重要的概念就是层叠式,层叠式是贯穿整个css的一个性质,包含继承性和层叠性. 继承性:对某个元素所设定的样式,不但 ...

最新文章

  1. ArrayList的内存泄露
  2. “{”: 未找到匹配令牌
  3. 阿里云获得SAP HANA 2T实例公共云认证
  4. php无法下单功能,PHP如何解决并发下单问题?(不一定是下单,举个例)
  5. Post/Redirect/Get模式防止表单重复提交
  6. HTML 5 全局属性
  7. 转: seajs手册与文档之 -- 模块标识
  8. [转]Hadoop集群_WordCount运行详解--MapReduce编程模型
  9. 互联网域名产业报告(2021年)
  10. C语言描述栈的实现及操作(数组实现)
  11. Codeforces Round #655 (Div. 2) B C
  12. mysql 升级和降级
  13. html中常见汉字字体的英文名称
  14. 圆柱体积怎么算立方公式_圆柱体积公式是什么,怎么算,
  15. Improved Pre-Warping for Wide Angle, Head Mounted Displays
  16. PYNQ 采集计划(二)Socket服务端与客户端的搭建,pynq到pc的数据流传输
  17. 【图像语义分割】Large Kernel Maters--Improved Semantic Segmentation by Global ConvNet
  18. 从壹开始[ 做贡献 ]之三 || 北京.Net俱乐部活动——DNT精英论坛开幕
  19. github.com/stretchr/testify/suite
  20. 无人机三维实景模型的应用和发展

热门文章

  1. Numpy——老师PPT
  2. 如何用电脑通过蓝牙连接手机上网
  3. (完整源码)H5贪吃蛇小游戏——HTML+CSS+JavaScript实现
  4. 如何给mysql数据库的字段设默认值
  5. 正则表达式与拳皇大招组合技(数字篇)
  6. 更换eclipse主题
  7. 【jetbrains】
  8. Thinkpad T14解除bitlocker
  9. 今日科技联播:袁隆平迪拜试种“沙漠海水稻”成功,阿里健康“扫一扫”排查问题疫苗!...
  10. 将字符串转成数组的方法