vue修改placeholde的样式
时间: 2024-05-15 15:17:44 浏览: 6
您可以通过以下方式修改Vue中placeholder的样式:
1. 在样式表中添加以下样式:
```css
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #999;
}
::-moz-placeholder { /* Firefox 19+ */
color: #999;
}
:-ms-input-placeholder { /* IE 10+ */
color: #999;
}
:-moz-placeholder { /* Firefox 18- */
color: #999;
}
```
2. 在Vue组件中添加以下代码:
```html
<template>
<div>
<input type="text" placeholder="请输入内容" v-model="input" class="my-input" />
</div>
</template>
<style>
.my-input::-webkit-input-placeholder {
color: #999;
}
.my-input::-moz-placeholder {
color: #999;
}
.my-input:-ms-input-placeholder {
color: #999;
}
.my-input:-moz-placeholder {
color: #999;
}
</style>
<script>
export default {
data() {
return {
input: '',
};
},
};
</script>
```
请注意,您需要将`.my-input`替换为您的输入框类名或ID。