ivew中Input控件删除边框的方式

最近在帮一个朋友做基于vue的前端界面开发，在开发的过程中遇到一个问题：清除iview框架中Input控件的边框

实现的步骤：

1 在组件文件中添加如下所示的代码

<template>
<div class="test">
    <Input  placeholder="Enter something..." clearable='true' style="width: 300px"></Input>
</div>
</template>

2、增加作用于全局的css样式代码

<style>
.test .ivu-input {
    border: none;
    outline: medium;
}

.test .ivu-input:focus {
    border: none;
    outline: medium;
    box-shadow: none;
}

.test .ivu-input:hover {
    border: none;
    outline: medium;
    box-shadow: none;
}
</style>

千万不要写成 <style scoped>

3、去除边框前后的效果图对比

去除前：

去除后：