element-ui组件DatePicker日期选择器移动端兼容

element-ui组件DatePicker日期选择器移动端兼容

css

css 复制代码
/** 移动端展示 **/
@media screen and (max-width: 500px) {
    .el-picker-panel__sidebar {
      width: 100%;
    }
    .el-picker-panel {
      width: 400px!important;
    }
    .el-picker-panel__content {
      width: 100%;
    }
    .el-picker-panel__body{
      margin-left: 0!important;
      display: flex;
      flex-direction: column;
      min-width: auto!important;
    }
    .el-picker-panel__sidebar {
      position: relative;
    }
    .el-picker-panel__body-wrapper {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
  }

注意不要给style标签加scoped属性会不生效

scoped作用

实现组件的私有化,不对全局造成样式污染,表示当前style属性只属于当前模块。

页面效果

相关推荐
大美B端工场-B端系统美颜师9 小时前
告别“搬砖”:在AI的辅助下,前端如何触及业务与架构的深水区?
ui·界面设计
ZH_1 021512 小时前
Qt-ui界面
ui
Stringzhua2 天前
ElementUi【饿了么ui】
前端·ui·elementui
啊森要自信2 天前
【GUI自动化测试】Python 自动化测试框架 pytest 全面指南:基础语法、核心特性(参数化 / Fixture)及项目实操
开发语言·python·ui·单元测试·pytest
程序员正茂2 天前
Unity3d中Tab控件的实现
ui·unity·tab·控件
jz_ddk2 天前
[LVGL] 从0开始,学LVGL:基础构建篇 - 掌握UI的核心构建块
linux·网络协议·ui·rpc·嵌入式·gui·lvgl
Rhys..2 天前
python自动化中(包括UI自动化和API自动化)env的作用和使用
python·ui·自动化
尤老师FPGA3 天前
使用ZYNQ芯片和LVGL框架实现用户高刷新UI设计系列教程(第三十二讲)
android·java·ui
Larry_Yanan3 天前
QML学习笔记(三十四)QML的GroupBox、RadioButton
c++·笔记·qt·学习·ui
打码的猿4 天前
在Qt中实现SwitchButton(开关按钮)
开发语言·qt·ui