一、效果演示
常见类型,右边的input框,光标在右侧 文字靠右侧,提示词颜色为红色,输入内容为黑色。
二、代码
<view class="inputBox">
<view>用户名</view>
<input type="text" placeholder-class="pclass" placeholder="请输入用户名">
</view>
.inputBox{
background-color:yellow;
padding: 0 30rpx;
height:100rpx;
display: flex;
justify-content: space-between;
align-items: center;
}
.inputBox>view{
font-size: 40rpx;
}
input{
height:100rpx;
border: 1px solid #000;
text-align: right;
font-size:30rpx;
}
//更改的是提示词的样式
.pclass{
color: red;
}
三、
placeholder-class=“pclass”
指定placeholder
样式类为pclass