el-select 如何修改样式

本篇博客就讨论宽高该如何修改

1. 宽

宽很修改,直接el-select 加行内样式

html 复制代码
    <el-select v-model="model" placeholder="placeholder"  style="width: 180px;">  
      <el-option  
          v-for="item in optionsList"  
          :key="item.value"  
          :label="item.label"  
          :value="item.value"  
      >  
      </el-option>  
    </el-select>

2. 高

高不能通过简单的行内样式修改,下面的代码还是基于上方的html代码 首先打开f12,查看el-select在控制台显示的样式名称,之后采取下面任意一种方法

2.1. 法一

使用scope语法

css 复制代码
<style scoped>  
:deep(.el-select__wrapper){  
  height: 100px;  
}  
</style>

2.2. 法二

不使用scope语法

css 复制代码
<style>  
.el-select__wrapper{  
  height: 100px;  
}  
</style>
相关推荐
冲浪中台8 小时前
【无标题】
前端·低代码
openKaka_8 小时前
beginWork 的第一站:HostRoot 如何把 App 接入 Fiber 树
前端·javascript·react.js
我命由我123458 小时前
Dart - Dart SDK、Hello World 案例、变量声明、常量声明、常量 final、字符串类型
前端·flutter·前端框架·html·web·dart·web app
冴羽yayujs8 小时前
GitHub 前端热榜项目 - 日榜(2026-05-11)
前端·github
~|Bernard|8 小时前
四,go语言中GMP调度模型
java·前端·golang
YOU OU8 小时前
HTML+CSS+JavaScript
前端·javascript·css·html
Rkgua8 小时前
路径传参和查询传参和请求体传参区以及Vue和React的用法区分
前端·面试
JarvanMo8 小时前
Flutter + Supabase 集成 Apple Sign-In 完整指南
前端
小村儿9 小时前
连载
前端·后端·ai编程
dinl_vin9 小时前
LangChain 系列·(九):Agent——让 AI 自己做决策
前端·人工智能·langchain