ElementUI 日历的官方文档
点击这里
官方文档的内容在此省略
目的-修改日历尺寸
现项目某功能需要使用日历插件显示日程安排,但ElementUI自带的尺寸太大,在网上试了几种方式去修改都不是很理想。
宽度的话使用width属性,可以进行调节;主要难点在于高度的调节。
直接修改height属性时,日历并不会随着高度的改变而自适应地改变高度,如下所示。
解决方法
使用深度选择器 /deep/ 去修改日历中每天的尺寸,详细CSS代码如下:
.test /deep/ .el-calendar-table .el-calendar-day{
width: 60px;
height: 40px;
}
最终效果如下图所示,大致解决了问题。
版权声明:本文为qq_34378032原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。