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

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

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属性只属于当前模块。

页面效果