微信小程序placeholder设置自定义颜色
原地址链接:https://blog.csdn.net/august_leo/article/details/80877382
这是微信小程序input组件的官方文档描述,下图红框里的placeholder-style
和placeholder-class
就是微信小程序里用来给placeholder设置样式的属性。
一、使用placeholder-style设置样式
placeholder-style相当于在标签的style属性,可直接在标签内设置。
- <input type="text" placeholder="请输入" placeholder-style="color:#e2e2e2;"></input>
示例如下:
wxml代码:
- <input type="text" placeholder="请输入" placeholder-style="color:#000;"></input>
wxss代码:
- input{
- width: 300rpx;
- border: 2rpx solid #000;
- margin: 50rpx auto;
- border-radius:10rpx;
- }
二、使用placeholder-class设置样式
用法:
wxml代码:
- <input type="text" placeholder="请输入" placeholder-class="placeholderStyle"></input>
wxss代码:
- .placeholderStyle{
- //样式
- }
微信小程序placeholder设置自定义颜色的更多相关文章
- 微信小程序wxss设置样式
微信小程序wxss设置样式 对于以前搞客户端开发的来说,有着客户端的逻辑,就是不知道怎么设置样式,把对应的控件显示出来 一.wxml 界面结构wxmL比较容易理解,主要是由八大类基础组件构成: 一.视 ...
- 微信小程序警告设置 enable-flex 属性以使 flexbox 布局生效的解决办法
微信小程序警告设置 enable-flex 属性以使 flexbox 布局生效的解决办法 具体情况: scroll-view 滚动,设置 display:flex 不生效并警告设置 enable-fl ...
- 微信小程序字体设置
微信小程序css篇----字体(Font) 一.字体:font.属性在一个声明中设置所有字体属性. 可设置的属性是(按顺序): "font-style font-variant font-w ...
- 微信小程序----wxss设置样式
一.wxml 界面结构wxmL比较容易理解,主要是由八大类基础组件构成: 一.视图容器(View Container): 二.基础内容(Basic Content) 组件名 说明 组件名 说明 vie ...
- 微信小程序如何设置服务器配置
最近微信小程序在it界火了起来,公司也要求我们开始接触微信小程序,废话不多说直接从配置微信小程序开始 1,首先,登录 https://mp.weixin.qq.com,(这里默认你已经获取到微信小程序 ...
- 微信小程序tabbar设置样式在哪里改
微信小程序tabbar通俗点说就是底部导航,我们一般会配置相关的菜单,方便读者快速导航.tabbar是在项目根目录中的配置文件 app.json 中进行设置:如果小程序是一个多 tab 应用(客户端窗 ...
- 微信小程序:设置启动页面
一.功能描述 微信小程序启动时,首先运行app.js,然后才跳转到第一个页面,也就是启动界面. 设置启动界面,只需要调整app.json的pages信息的位置,放在第一条的page记录便是启动界面
- 微信小程序学习笔记(1)-微信小程序样式设置逻辑
1.微信小程序的样式设置统一在每一页的.wxss的样式文件中,所有的样式设置代码统一写入这个文件中: 2.样式主要是通过.wxml里面控件的“class”属性来调用,此处调用会有几个细节要注意: 1) ...
- 微信小程序高度设置为100%
在网页中设置body,html{height:100%}; 将body和html设置为100%,这样我们就可以在他们的子元素中使用height:100%来使的我们的容器元素占满屏幕的高度啦. 但是在微 ...
随机推荐
- Vue2.0 【第二季】第7节 Component 组件 props 属性设置
目录 Vue2.0 [第二季]第7节 Component 组件 props 属性设置 第7节 Component 组件 props 属性设置 一.定义属性并获取属性值 二.属性中带' - '的处理方式 ...
- 取url地址参数
let url = 'https://i-beta.cnblogs.com/posts/edit?param1=123¶m2=second'let arr = url.split('& ...
- $api 回调函数then应用
getReceiveListAPI (param) { return new Promise(resolve => { let params = { // idCard: this.idCard ...
- 为了弄懂Flutter的状态管理, 我用10种方法改造了counter app
为了弄懂Flutter的状态管理, 我用10种方法改造了counter app 本文通过改造flutter的counter app, 展示不同的状态管理方法的用法. 可以直接去demo地址看代码: h ...
- 利用JDBC工具类添加和查询数据-Java(新手)
JDBC工具类: 1 package cn.lxr.jdbclx; 2 3 import java.sql.*; 4 5 public class JDBCUtils { 6 private stat ...
- Natas21 Writeup(共用session、session注入)
Natas21: 第一个网页 第二个网页 提示http://natas21.natas.labs.overthewire.org/页面和http://natas21-experimenter.nata ...
- 在eclipse里面给maven项目打包
eclipse中的“maven install”是用maven打包工程的意思. mvn install 是将用户打包好的jar包安装到本地仓库中,一般没有设置过的话默认在用户目录下的 .m2\下面. ...
- JavaScript FormData对象,FileReader对象,files属性
一.ajax与FormData的使用 最近在使用ajax朝后端提交数据时,如果提交的数据都是普通键值对还好说,直接使用ajax默认的格式向后端提交即可. $('#d1').click(function ...
- idea的ktorm框架代码生成器插件
*:first-child { margin-top: 0 !important; } .markdown-body>*:last-child { margin-bottom: 0 !impor ...
- 动态规划/MinMax-Stone Game
2019-09-07 16:34:48 877. Stone Game 问题描述: 问题求解: 典型的博弈问题,也是一个典型的min-max问题.通常使用算diff的方法把min-max转为求max. ...