elementui在ie9浏览器下的兼容性问题及解决方法

4 篇文章 0 订阅
1 篇文章 0 订阅

1、el-select组件内在IE9中会出现下图样式错乱,解决办法:

// select框固定下拉箭头兼容ie9

.el-select .el-input .el-input__suffix .el-icon-arrow-up{

    -ms-transform: rotate(180deg)\0;

}

2、IE9中elementui的message提示框会出现样式错乱,解决方法:

// 兼容ie9,使提示框显示正常, \0是让这条代码只在IE9中生效;

.el-message .el-message__content{

    display: inline-block\0;

}

3、IE9中el-cascader组件下拉没有水平对齐,解决方法:

// ie9 el-cascader兼容性问题

.el-cascader-menu__list .el-cascader-node .el-cascader-node__postfix,

.el-cascader-menu__list .is-active .el-cascader-node__prefix{

    top: 10px\0;

}

4、IE9日期组件样式问题解决方法:

/* 解决IE9 日期组件样式问题 */

.demonstration, .el-date-editor--datetimerange {

    display: inline-block !important;

    vertical-align: middle;

    line-height: 24px;

}

5、IE9的弹性布局flex都会失效,凡是在IE9中使用flex的都需要改成float浮动布局或者使用display: inline-block;属性来纠正。

6、如果要想使某一行代码在IE9中生效那么只需在代码后面添加 \0 ,例如: float: left\0;

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值