修改element UI 中menu菜单的小箭头

修改element UI 中menu菜单的小箭头_第1张图片

        menu菜单的小箭头所在的位置有时候是不满足我们的ui设计稿,所以就需要修改menu菜单的小箭头          原组件中小箭头是被使用定位固定的                我们在修改的是先要确保在style标签中  去掉了scoped属性           因为如果没有去掉 一些样式是无法修改的 (不只是小箭头 其他样式也是一样的)     当我们给小箭头重新定位的时候       如果给对应的 i 标签宽高的话     小箭头就会非常的调皮不听你的使唤     所以一定要设置宽高 来限制小箭头的调皮

例如: 

 修改element UI 中menu菜单的小箭头_第2张图片

 给他宽高 他就会乖乖听话!!!

 由于在一个页面中很个能会用到多个element ui中的组件          如果你只是单纯的改变了当前的样式细节         含有可能会影响到其他位置的组件          对于这个问题 你们有什么好办法吗?快将你们聪明的脑袋想到的东西拿出来与我分享吧!!!!

我在这里介绍一下我的笨办法吧                                 那就是使用后代选择器





    
    
    
    Document



    
要记住这个方法哦

我就不记住 气死你

 简单的看一下吧   我就是简单的写了个样式 简单的介绍一下思路    对比下两个样式  发现神奇之处 

如果你觉得有用的话就分享给有需要的人吧 !!!

你可能感兴趣的:(element,UI,css,menu菜单,css,css3,前端)