怎么修改elementui中message样式
时间: 2023-09-02 15:10:06 浏览: 221
修改elementUI的样式
要修改 ElementUI 中 message 组件的样式,可以按照以下步骤操作:
1. 在项目中新建一个样式文件,比如说 `custom-element-ui.css`,并将其引入到你的项目中。
2. 在这个文件中,添加以下代码:
```
.el-message {
/* 修改背景色 */
background-color: #f0f;
/* 修改字体颜色 */
color: #fff;
/* 修改字体大小 */
font-size: 16px;
}
```
这里只是举了几个例子,你可以根据自己的需求修改其他样式属性。
3. 在页面中引入 `custom-element-ui.css` 文件,这样就可以看到 message 组件的样式已经被修改了。
需要注意的是,如果你使用了按需加载的方式引入 ElementUI,那么你需要在 `babel.config.js` 文件中添加 `styleLibraryName: "~src/custom-element-ui"` 配置,将 ElementUI 的样式导出到 `custom-element-ui.css` 中。
阅读全文