小程序input的placeholder不垂直居中的问题解决

news2024/11/17 6:46:56

input的placeholder不垂直居中,input设置高度后,使用line-height只能使输入的文字垂直居中,但是placeholder不会居中,反而会偏上。

  1. 首先placeholder样式自定义

有两种方法,第一种行内样式:

<input type="text" placeholder="姓名" placeholder-style="font-size:28rpx;color:#999999;" />

第二种加类名:
给input加上placeholder-class属性,然后给该属性 设置一个类名,在style中设置样式。

<input  type="text"  placeholder="地址" placeholder-class="address"/>
 <style>
 	.address{
		color: red;
	}
 </style>

placeholder的字体颜色都能改变,但是仍然不会在input框里垂直居中,一直偏上,查了很多方法都不管用,比如:

在这里插入图片描述

比如:

在这里插入图片描述
能垂直居中是能,但是input框变得没有内边距了,很不好看。

  1. 最后找到解决办法了:

在placeholder上增加pandding-top,把提示文字顶下来

参考:IOS下input的placeholder不垂直居中的问题

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/933497.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

全国首台!浙江机器人产业集团发布垂起固定翼无人机-机器人自动换电机巢

展示突破性创新技术&#xff0c;共话行业发展趋势。8月25日&#xff0c;全国首台垂起固定翼无人机-机器人自动换电机巢新品发布会暨“科创中国宁波”无人机产业趋势分享会在余姚市机器人小镇成功举行。 本次活动在宁波市科学技术协会、余姚市科学技术协会指导下&#xff0c;由浙…

squid服务器

目录 squid初识 安装squid代理 常用命令 主要配置文件 正向代理 环境配置 linux服务器设置 windows客户端设置 反向代理 环境配置 在web服务器配置服务 linux服务器配置 squid初识 含义&#xff1a;squid cache是一个流行的自由软件&#xff08;GNU通用公共许可证…

奥比中光:进击具身智能,打造机器人之眼

大数据产业创新服务媒体 ——聚焦数据 改变商业 跨过奇点的生成式人工智能是一个缸中大脑&#xff0c;只有赋予形体&#xff0c;才能与物理世界产生互动。 在5月的ITF世界半导体大会上&#xff0c;英伟达创世人兼CEO黄仁勋说&#xff0c;人工智能的下一波浪潮将是具身智能。 8…

消息中间件 介绍

MQ简介 MQ,Message queue,消息队列&#xff0c;就是指保存消息的一个容器。具体的定义这里就不类似于数据库、缓存等&#xff0c;用来保存数据的。当然&#xff0c;与数据库、缓存等产品比较&#xff0c;也有自己一些特点&#xff0c;具体的特点后文会做详细的介绍。 现在常用…

TabBar组件如何跳转页面?

1、先引入 2、假数据 const tabs [{key: home,title: 首页,icon: <AppOutline />,badge: Badge.dot,},{key: todo,title: 待办,icon: <UnorderedListOutline />,badge: 5,},{key: message,title: 消息,icon: (active: boolean) >active ? <MessageFill /&…

开源与数据科学:一个完美的组合?

&#x1f337;&#x1f341; 博主猫头虎 带您 Go to New World.✨&#x1f341; &#x1f984; 博客首页——猫头虎的博客&#x1f390; &#x1f433;《面试题大全专栏》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33a; &a…

如何在VSCode中将html文件打开到浏览器

天行健&#xff0c;君子以自强不息&#xff1b;地势坤&#xff0c;君子以厚德载物。 每个人都有惰性&#xff0c;但不断学习是好好生活的根本&#xff0c;共勉&#xff01; 文章均为学习整理笔记&#xff0c;分享记录为主&#xff0c;如有错误请指正&#xff0c;共同学习进步。…

Java学数据结构(2)——树Tree 二叉树binary tree 二叉查找树 AVL树 树的遍历

目录 引出什么是树Tree&#xff1f;树的实现二叉树binary tree查找树ADT——二叉查找树Binary Search Tree1.contains方法2.findMax和findMin方法3.insert方法4.remove方法&#xff08;复杂&#xff09;二叉查找树的深度 AVL(Adelson-Velskii和Landis)树——平衡条件(balance c…

元矿山下的音视频应用

// 近年来&#xff0c;矿业的技术和管理模式随着元宇宙的火爆和自动驾驶技术的发展逐渐变化、升级&#xff0c;进而衍生出元矿山的概念&#xff0c;音视频技术也在其中成为了关键一环。LiveVideoStackCon 2023 上海站邀请了来自希迪智驾的任思亮&#xff0c;为大家分享希迪智…

Haproxy+Keepalive 整合rabbitmq实现高可用负载均衡

Haproxy 实现负载均衡 HAProxy 提供高可用性、负载均衡及基于 TCPHTTP 应用的代理&#xff0c;支持虚拟主机&#xff0c;它是免费、快速并且可靠的一种解决方案&#xff0c;包括 Twitter,Reddit,StackOverflow,GitHub 在内的多家知名互联网公司在使用。HAProxy 实现了一种…

Rhino软件安装包分享(附安装教程)

目录 一、软件简介 二、软件下载 一、软件简介 Rhino是一款三维计算机辅助设计&#xff08;CAD&#xff09;软件&#xff0c;由Robert McNeel & Associates公司开发。它被广泛应用于工业设计、建筑设计、珠宝设计、玩具设计等领域&#xff0c;是一款非常流行的三维建模软…

05.sqlite3学习——DML(数据管理:插入、更新、删除)

目录 DML&#xff08;数据管理&#xff1a;插入、更新、删除&#xff09; 插入 更新 删除整个表 语法 实例 DML&#xff08;数据管理&#xff1a;插入、更新、删除&#xff09; 数据操纵&#xff08;DML&#xff09;&#xff1a;用于增、删、改数据 作用&#xff1a;负…

【Git游戏】远程分支

origin/<branch> 远程分支在本地以 origin/<branch>格式存在&#xff0c;他指向上次和远程分支通过时的记录 git checkout origin/<branch> 会出现HEAD分离的情况 与远程通讯 git fetch —— 从远端获取数据&#xff08;实际上将本地仓库中的远程分支更新…

Apache的简单介绍(LAMP架构+搭建Discuz论坛)

文章目录 1.Apache概述1.1什么是apache1.2 apache的功能及特性1.2.1功能1.2.2特性 1.3 MPM 工作模式1.3.1 prefork模式1.3.2 worker模式1.3.3 event模式 2.LAMP概述2.1 LAMP的组成2.2 LAMP各组件的主要作用2.3 LAMP的工作过程2.4CGI和FastCGI 3.搭建Discuz论坛所需4.编译安装Ap…

开源在物联网(IoT)中的应用

&#x1f337;&#x1f341; 博主猫头虎 带您 Go to New World.✨&#x1f341; &#x1f984; 博客首页——猫头虎的博客&#x1f390; &#x1f433;《面试题大全专栏》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33a; &a…

小研究 - JVM 逃逸技术与 JRE 漏洞挖掘研究(一)

Java语言是最为流行的面向对象编程语言之一&#xff0c; Java运行时环境&#xff08;JRE&#xff09;拥有着非常大的用户群&#xff0c;其安全问题十分重要。近年来&#xff0c;由JRE漏洞引发的JVM逃逸攻击事件不断增多&#xff0c;对个人计算机安全造成了极大的威胁。研究JRE安…

Maven导入包

有些时候maven导入不进去包&#xff0c;这个时候可以去直接去maven仓库找到你需要的包 https://mvnrepository.com/ 在自己本地输入命令 &#xff08;这只是一个样例&#xff0c;请根据自己需要的包参考&#xff09; mvn install:install-file -Dfile"C:/Users//Downloa…

Audition软件安装包分享(附安装教程)

目录 一、软件简介 二、软件下载 一、软件简介 Audition软件是一款由Adobe公司开发的音频处理软件&#xff0c;主要用于音频录制、编辑、混音和音效处理。它提供了丰富的工具和功能&#xff0c;帮助用户处理各种音频需求&#xff0c;如制作音乐、广播节目、音频纪录片等。 A…

2023年新型智慧城市顶层设计规划解决方案86页[PPT]

导读&#xff1a;原文《2023年新型智慧城市顶层设计规划解决方案86页[PPT]》&#xff08;获取来源见文尾&#xff09;&#xff0c;本文精选其中精华及架构部分&#xff0c;逻辑清晰、内容完整&#xff0c;为快速形成售前方案提供参考。 内容简介 智慧城市顶层设计&整体架…

电商PC端设计之店招

设计总资料&#xff1a; 1、裂帛 2、小狗电器 3、店招120PX&#xff0c;导航栏30px 4、毕业那些年的店招 5、操作实例&#xff0c;建立120PX的画布 6、产品多的时候要加搜索框 7、产品店招在左边&#xff0c;主推产品在右边 8、贝蒂佩琪 实战案例 1、利用画布调整图像大小 2、…