el-input 中的字体加粗
时间: 2023-08-18 15:18:18 浏览: 176
要让 el-input 中的字体加粗,可以给 el-input 组件的样式添加 font-weight: bold; 即可,示例代码如下:
```html
<template>
<el-input v-model="inputValue" class="bold"></el-input>
</template>
<style>
.bold input {
font-weight: bold;
}
</style>
```
在上面的代码中,我们在 el-input 组件上添加了一个名为 bold 的 class,并在该 class 的样式中设置了字体加粗的样式。这样 el-input 中的文字就会显示为加粗的样式。
相关问题
el-input 中的字体加粗加黑
要让 el-input 中的字体同时加粗和加黑,可以给 el-input 组件的样式添加 font-weight: bold; 和 font-family: '黑体', sans-serif; 即可,示例代码如下:
```html
<template>
<el-input v-model="inputValue" class="bold-black"></el-input>
</template>
<style>
.bold-black input {
font-weight: bold;
font-family: '黑体', sans-serif;
}
</style>
```
在上面的代码中,我们在 el-input 组件上添加了一个名为 bold-black 的 class,并在该 class 的样式中设置了字体加粗和加黑的样式。这样 el-input 中的文字就会同时显示为加粗和加黑的样式。注意,如果用户的设备中没有安装黑体字体,那么系统会使用 sans-serif 字体来替代。
el-input placeholder css字体加粗
根据提供的引用内容,可以使用以下CSS样式来将el-input的placeholder字体加粗:
```css
.textarea-nput-box .el-input__inner::placeholder {
font-weight: bold;
}
```
这样就可以将el-input的placeholder字体加粗了。\[1\]
#### 引用[.reference_title]
- *1* *2* [vue修改子组件中的el-input的placeholder字体颜色](https://blog.csdn.net/weixin_49668076/article/details/126509643)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
- *3* [vue 设置 el-input 的 placeholder 的文本颜色以及样式](https://blog.csdn.net/HH18700418030/article/details/125429906)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]