el-dialog的title字体颜色
时间: 2023-10-04 19:05:46 浏览: 82
el-dialog的title字体颜色可以通过修改样式来实现。你可以在el-dialog组件中使用slot="title",然后在slot中添加一个div元素,通过设置其style属性来改变字体颜色。比如,可以设置font-size为18px,color为#38b48b,font-weight为bold来改变title的字体颜色。代码如下所示:
```
<el-dialog :visible.sync="dialogFormVisible">
<template slot="title">
<div style="font-size: 18px; color: #38b48b; font-weight: bold;">已分配人员(勾选后点击撤销可取消分配)</div>
</template>
...
</el-dialog>
```
这样就可以将el-dialog的title字体颜色修改为指定的颜色了。
相关问题
el-dialog title标题居中
可以通过自定义样式来实现el-dialog的title标题居中显示。可以在el-dialog的样式中添加如下代码:
```css
.el-dialog .el-dialog__header {
text-align: center;
}
```
这样就可以将el-dialog的标题居中显示了。同时,如果需要修改标题的样式,可以在el-dialog的title属性中添加自定义的class,然后通过样式来修改标题的样式。例如:
```html
<el-dialog title="这是一个标题" :visible.sync="dialogVisible" :close-on-click-modal="false" :close-on-press-escape="false" custom-class="my-dialog">
<!-- 对话框内容 -->
</el-dialog>
```
```css
.my-dialog .el-dialog__title {
font-size: 20px;
color: red;
}
```
这样就可以将标题的字体大小改为20px,颜色改为红色。
怎么设置el-dialog的title字体加粗
可以使用CSS来设置`el-dialog`的`title`字体加粗。具体方法如下:
1. 在`<style>`标签中或者CSS文件中添加以下样式:
```css
.el-dialog__title {
font-weight: bold;
}
```
2. 或者在`<el-dialog>`组件中添加`custom-class`属性,并在CSS文件中针对该类名设置样式:
```html
<el-dialog title="这里是标题" custom-class="dialog-title-bold">
<!-- 对话框内容 -->
</el-dialog>
```
```css
.dialog-title-bold .el-dialog__title {
font-weight: bold;
}
```
以上两种方法都可以实现`el-dialog`的`title`字体加粗效果。