如何在iView中自定义输入元素的CSS？
如何在iView中自定义输入元素的CSS？
提问于 2018-01-23 04:15:57
我使用的是Vue的单文件组件，并想尝试一下iView UI框架。假设有以下代码：
<template>
<div>
<i-input class="cred"/>
</div>
</template>然后，我想要更改输入的宽度。例如，要检查更改是否生效，请执行以下操作：
<style scoped>
input {
width: 10px;
}
</style>但它没有任何效果。我也试过i-input。
<style scoped>
.cred {
width: 10px;
}
</style>按照预期工作。
我应该使用哪个CSS选择器？
回答 1
Stack Overflow用户
发布于 2018-01-23 15:29:22
Vue/iView允许您使用内联style属性并向其传递宽度，或者您也可以更改.ivu-input-wrapper CSS类并为其提供所需的with。
Vue.use(iview);
new Vue({
data() {
return {
value: ''
}
}
}).$mount('#app')@import url("//unpkg.com/iview/dist/styles/iview.css");
#app {
padding: 32px;
}
.ivu-input-wrapper {
width: 400px;
}<script src="//unpkg.com/vue/dist/vue.min.js"></script>
<script src="//unpkg.com/iview/dist/iview.min.js"></script>
<div id="app">
<i-input v-model="value" placeholder="CSS changed..."></i-input>
<i-input v-model="value" placeholder="Inline style changed..." style="width: 200px"></i-input>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/48389573
复制相关文章
相似问题
腾讯云开发者
