微信小程序-自定义placeholder颜色和样式

￡神魔★判官ぃ 2022-04-04 05:15 2096阅读 0赞

一、使用placeholder-style设置样式
placeholder-style相当于在标签的style属性，可直接在标签内设置。

用法：

  1. <input type="text" placeholder="请输入" placeholder-style="color:#e2e2e2;"></input>

wxml代码：

  1. <input type="text" placeholder="请输入" placeholder-style="color:#000;"></input>

wxss代码：

  1. input{
  2.   width: 300rpx;
  3.   border: 2rpx solid #000;
  4.   margin: 50rpx auto;
  5.   border-radius:10rpx; 
  6. }

二、使用placeholder-class设置样式

wxml代码：

  1. <input type="text" placeholder="请输入" placeholder-class="placeholderStyle"></input>

wxss代码：

  1. .placeholderStyle{
  2.   //样式
  3. }

示例如下：

wxml代码：

  1. <input type="text" placeholder="请输入" placeholder-class="placeholderStyle"></input>

wxss代码：

  1. input{
  2.   width: 300rpx;
  3.   border: 2rpx solid #000;
  4.   margin: 50rpx auto;
  5.   border-radius:10rpx; 
  6. }
  7. .placeholderStyle{
  8.   color:#000;
  9.   font-size: 26rpx;
  10. }

转载地址：https://blog.csdn.net/august_leo/article/details/80877382#comments

发表评论

表情：
评论列表 （有 0 条评论，2096人围观）

还没有评论，来说两句吧...

相关阅读