iview 如何设置sider宽度

iview layout组件中,sider设置了默认宽度和最大宽度,在css样式文件中修改无效,原因是iview默认样式设置在了element.style中,只能通过行内样式修改

样式如下:


image.png

image.png

修改方式:

1.官方文档中写明修改宽度通过传参数width实现


image.png

详见iview组件 layout部分
布局 Layout - iView (iviewui.com)

2.使用行内样式覆盖源样式

复制代码
<sider style="width: 300px;min-width: 300px;max-width: 300px;flex: 0 0 300px;">

补充:

神奇的技巧

如果想让sider的宽度自适应父元素,将width的值设置为空即可

代码:

复制代码
 <sider :width="''">

sider的class


image.png

原创
© 著作权归作者所有,转载或内容合作请联系作者

喜欢的朋友记得点赞、收藏、关注哦!!!

相关推荐
青云交几秒前
Java 大视界 -- Java 大数据在智能交通高速公路收费系统优化与通行效率提升实战
java
哪里不会点哪里.4 分钟前
IoC(控制反转)详解:Spring 的核心思想
java·spring·rpc
凸头7 分钟前
Nginx配置学习
运维·学习·nginx
麦兜*10 分钟前
SpringBoot Actuator监控端点详解,打造生产级应用健康检查
java·spring boot·后端
木风小助理17 分钟前
未来JS架构:Realm隔离——从全局共享到独立环境的必然
学习
悟能不能悟17 分钟前
Spring Boot 中处理跨域资源
java·spring boot·后端
非凡ghost19 分钟前
批量校正图像方向(校正PDF页面方向)
windows·学习·pdf·软件需求
qq_124987075319 分钟前
基于springboot+vue的无人机共享管理系统(源码+论文+部署+安装)
java·vue.js·spring boot·后端·毕业设计·无人机·计算机毕业设计
科技林总21 分钟前
【系统分析师】5.1 数据库管理系统
学习
多多*23 分钟前
计算机网络相关 讲一下rpc与传统http的区别
java·开发语言·网络·jvm·c#