css盖过element UI不生效

最新推荐文章于 2023-12-20 16:05:34 发布
最新推荐文章于 2023-12-20 16:05:34 发布
阅读量311 收藏
点赞数
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_47333020/article/details/109610553
版权

错误描述

在这里插入图片描述
这时原来的样式
由于表单的长度太长了
所以向加一个滚动条
在浏览器端先调试
在这里插入图片描述
将调试结果复制到style样式里
在这里插入图片描述
刷新页面
在这里插入图片描述
样式依然没有变化
考虑到可能时优先级的问题
在样式里加上！important
在这里插入图片描述
刷新，依然没改变。。。。

错误原因

由于我在style样式上加了scoped属性
这个属性会使得其包裹的样式只能在本页面里的元素享受到
而我要改变的elementUI的样式
所以解决就是把scoped属性删去即可
在这里插入图片描述
在这里插入图片描述
这个属性时当初为了防止样式污染而添加的
没想到现在卡了我半小时。。。。

it界的哈士奇
关注
专栏目录
Vue-cli脚手架项目引入Element-Ui不生效问题
weixin_43403746的博客
09-27 2116
背景： 已经很久没有初始化项目了，今天在初始化项目引入element-ui插件时发现居然没有生效，最直观的就是没有标签提示。我是通过npm安装element-ui。 npm i element-ui -S 然后在main.js文件中引入了安装好的element-ui并使用。 但使用时并没有标签提示，而且效果也没有出来。 解决方案： 查了后才发现，除了要引入element-ui外，还需要引入它对应的css包，也就是需要将下面这句话写入到main.js中。 import ‘element-ui/lib
vue element 项目默认css文件 style
01-02
在`styles`文件中，你可以定义全局CSS变量、通用的样式规则，或者是一些Element UI组件的自定义样式。例如，你可能想要改变Element UI的默认主题色，可以在这里定义CSS变量，然后在组件样式中引用它们： ```css /* ...
elementUI组件修改样式 覆盖无效
吴冬雪的博客
05-31 7333
为了vue页面样式模块化，不对全局样式造成污染，我们往往都会加入scoped属性用来限制样式的作用域，然而这也会导致当我们修改部分ui组件样式失效。为了避免这种情况，我们常用以下方式来解决。通过 >>> 可以使得在使用scoped属性的情况下，穿透scoped，修改其他组件的值。在我们使用第三方UI组件库开发时有时需要对这些组件进行一些样式修改。深度选择器/deep/与>>>作用相同。
(javascript)vue项目打包后，写的覆盖element的样式无效了。这是什么原因？
学习笔记666
08-20 9377
问题： (javascript)vue项目打包后，写的覆盖element的样式无效了。这是什么原因？描述: 在开发模式模式下，写的覆盖样式都有效，打包后就无效，请问下是什么原因? main.js里的css加载顺序 开发模式下 打包后在浏览器查看 解决方案1: 你的问题就是css权重问题 如果相同权重可能存在引入顺序问题 简单粗暴解决办法  1： 如果是单页面 写入index.htm...
引入element-ui组件后样式无效
木昆灵寒酥的博客
08-11 916
引入element-ui组件后样式无效，解决办法。
element-ui无法覆盖样式解决办法一
Ryan_black的博客
03-05 3003
我添加的样式: <el-card class="myself"> </el-card> <style> .myself{ background-color: blue; color: blue; position: absolute; width: 500px; height: 700px; left: 60%;...
vue 引入element-ui，样式不生效-（已解决）
ansheng02的博客
11-24 7697
https://www.cnblogs.com/Mr-lin66/archive/2019/05/25/13791884.html
Element UI主题样式文件
最新发布
04-07
Element UI 是一个基于 Vue.js 的开源 UI 组件库，它为开发者提供了丰富的组件，如表格、按钮、对话框、通知等，便于快速构建美观且功能强大的 Web 应用。在 Element UI 中，主题样式文件是实现自定义界面颜色和风格...
element ui 不生效
09-14
综上所述，当Element UI样式不生效时，你可以检查样式的层级结构，避免被其他样式覆盖或影响，并尝试使用作用域样式或CSS Modules来解决全局样式影响的问题。如果还有其他特定的问题，你可以参考相关文档或解决方案...
解决Vue的项目使用Element ui 走马灯无法实现的问题
10-15
import 'element-ui/lib/theme-chalk/index.css'; Vue.use(ElementUI); ``` ### 引入走马灯组件 在 Element UI 官网上，可以找到走马灯组件的详细说明和代码示例。引入走马灯组件到项目中之后，可以通过在 HTML ...
[vue]饿了么的element-ui修改样式后不生效
weixin_34162695的博客
01-30 1062
2019独角兽企业重金招聘Python工程师标准>>> ...
Element UI修改样式不生效，最简单粗暴的解决方法！
HaushoLin的博客
02-27 2452
参考网上的去掉style中的scoped作用域那样确实生效，但是会影响其他组件的样式。我们直接在该类名前添加::v-deep就可以，赶紧去试试看吧，超实用！ // 在类名前添加 ::v-deep 方法和属性后的 !important ::v-deep .el-input__prefix { left: 71px !important; transition: all 0.3s; } ...
引入element ui， 组件生效，但是部分样式未生效
weixin_45868184的博客
12-20 163
反复实验后，都不能让样式生效，换个浏览器就可以生效了。还可以关了重新启动一下可能也可以解决问题。
elementui自定义样样式文件无法覆盖问题
aigan8378的博客
06-16 502
et 生成的文件需要在use之后使用，不然无法覆盖原来样式Vue.use(ElementUI);import '../theme/index.css' 转载于:https://www.cnblogs.com/shenssr/p/11029534.html
解决VUE引用element不能显现组件css样式问题
qq_45864822的博客
06-23 2287
1.码友们在用element开发时可能会发现不能够显现原本element样式问题，这时候就要检查一下自己有没有在main.js中导入import'element-ui/lib/theme-chalk/index.css' 。导入进去问题就能解决啦
Vue 修改 Element-UI 组件的原生样式
qq_39249627的博客
06-11 1911
Vue 修改 Element-UI 组件的原生样式
震惊！！！一眼就能看懂的element-ui引入和修改样式问题！！！！
m0_52009348的博客
07-09 350
安装使用element-ui框架 (1)下载指令 npm i element-ui -S (2)在main.js中引入 import Vue from ‘vue’; import ElementUI from ‘element-ui’; import ‘element-ui/lib/theme-chalk/index.css’; import App from ‘./App.vue’; Vue.use(ElementUI) 更改element ui 的三种方式 (1)给组件加上id或者class，然后添加一
关于 Element-UI 不生效 CSS样式不生效问题
weixin_42648006的博客
05-20 3730
1、未单独引入css文件 在main.js中单独引入一下文件 import 'element-ui/lib/theme-chalk/index.css'; 2、vue.config.js配置错误 将以下属性设置成了false，去掉文件名中的 .module 默认值为true，注释即可 // requireModuleExtension: false ......
vue+elementUI修改样式不生效的解决过程
qq_38024443的博客
01-10 5866
学校大作业，我负责的前端部分，正好前段时间学习了vue和elementUI，就来实践一下，部分代码如下： <div class="ipInput"> <el-input class="ip" v-model="part1"></el-input> ...... </div> 后来我发现在el-input舔加样式使文字居中但并没有生效 <div class="ipInput"> <el-input class=
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值