Element-UI 不能自定义样式吗_Html5_论坛

Element-UI 不能自定义样式吗

陈***0 分类：Html5 人气：1510 回帖：7 发布于6年前收藏

vue 文件中的关键代码差不多就下面这样

<el-form-item>
   <el-input v-model="form.name" auto-complete="off" placeholder="手机号\邮箱\用户名" class="login-form-input"></el-input>
</el-form-item>

<style>
    .login-form-input .el-input__inner {
        border: 0 none;
        border-bottom: 1px solid #ccc;
        border-radius: 0px;
    }
</style>

浏览器中渲染出来的 html

但是编译出来的 style不知道为什么选择器被修改了，加了个属性选择器。

我试了下，只要是写在 vue文件中的样式，编译出来都会加一个属性选择器。这怎么搞？意思是 Element-UI 只能大概定制一下主题，不能改太细节的东西？

标签：vue.js css html html5 javascript

讨论这个帖子（7）垃圾回帖将一律封号处理……

Lv5 码农

龙***爸 Linux系统工程师 6年前#1

可以但是必须优先级要高

Lv6 码匠

15***57 UI设计师 6年前#2

我也遇到了类似的问题，网上找了好久，官方的方法比较适合针对某个项目进行全方位的样式重构，如果只是在开发中引用一两个组件太麻烦，如果直接在组件样式里重构，因为有scoped的存在，会给类名加一个唯一标识符，所以重写样式无法修改，去掉scoped又会污染其他组件样式，我最后想了个方法。直接在组件里加一层div，类名和组件一致，在这个类名下进行样式修改然后把style的scoped去掉，这样又能针对这个组件重置UI库的样式又不会影响其他组件。如果想整体修改的话直接去改源码就行了，或者在App.vue下改。