关于 input 输入框在 ios 端 placeholder 显示不全输入的文字显示不全问题

最新推荐文章于 2025-02-13 13:45:24 发布

飞啊飞我的骄傲放纵-未来全栈工程师

最新推荐文章于 2025-02-13 13:45:24 发布

阅读量1.4k

点赞数 2

分类专栏： css 文章标签： css

本文链接：https://blog.csdn.net/weixin_44378370/article/details/107288249

版权

css 专栏收录该内容

3 篇文章

订阅专栏

如下：

// An highlighted block
	line-height: normal;
    transform: translateZ(0);
    outline: none;
    -webkit-appearance: none;

line-height: normal; 是一定不可缺少的

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

飞啊飞我的骄傲放纵-未来全栈工程师

关注关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

iOS textarea标签 placeholder多行时被隐藏，收起键盘又显示

yujin0213的博客

09-17

1614

问题描述如下图所示，项目里用到了textarea及其placeholder属性。在iOS上输入文字后删除，placeholder文字被隐藏了，只能显示一行，收起键盘后又能正常显示原因未知解决方案 1、思路动态设置标签的placeholder属性，获取输入框的值，当输入框的值为空时显示placeholder，不为空时不显示 2、具体代码我的项目是用react写的，所以下面代码实现也是r...

解决input标签在ios中光标不居中问题，同时兼容安卓

又又的博客

06-22

1034

1、首先input的所有父级元素不能加 line-height 属性; 2、初始化input样式 line-height:normal; 3、要想光标不撑满这个input狂，加一个上下边框 4、代码如下，有需要的小伙伴可以试试： Html： <div class="head-search-item"> <input type="text"placeholder="请输入商品/店铺名称"> <div class="icon"> ...

参与评论您还未登录，请先登录后发表或查看评论

解决 ios 输入框属性--placeholder--不显示

日积月累默默搬砖

03-01

3616

在我们写移动端项目时,会发现在IOS手机上,部分输入框的默认文字会隐藏,在此提供一套解决方法,此方法已经历过实际项目的测试,可放心的应用于实战将此段js代码放置在项目的公共js文件中即可 if (!('placeholder' in document.createElement('input'))) { $('input[placeholder],textarea[placeho...

关于uniapp input标签，placeholder显示不全的问题

G806218的博客

02-13

246

本文章只针对于我在开发时的一种情况，因为给input标签设置了flex属性就会导致此问题。修改只需要取消掉flex属性即可。

input属性placeholder在iOS中显示不完整的解决方法

Lval的博客

09-26

1573

在一些高版本的ISO上设置placeholder显示的字体大小的时候,有时候会被遮挡掉一部分出现原因：input 里面的字体大小小于placeholder的字体大小解决方法: 设置input字体大于placeholder的字体 input{ font-size: 16px; } ::-webkit-input-placeholder{ font-size: 13px; } ...

ios上input输入框只显示一半高度的字

dream12331的博客

01-07

2578

在ios上input输入框只显示一半高度的字，那是因为我们没有固定input输入框的高度，可以把input输入框写死高度看下，我已解决这个问题

input框设置placeholder属性在iOS中显示不完整

G佳伟

03-12

1303

input框设置placeholder属性设置font-size在iOS中显示不完整问题显示情况如下：问题所在：由于在css设置了placeholder的font-size，没有设置input整体的font-size，所以input没有撑开！！！！！！解决办法: 在设置 placeholder的font-size时也需要设置input的font-size并且input的font-si...

解决 - 解决ios input 和textarea不能输入的问题

sunshime的博客

07-19

2701

写移动端项目总有一些兼容性需要我们解决滴，就比如我现在遇到的问题：ios 无法正常在input和textarea上面输入我们需要的内容，而安卓手机是可以正常输入的，一点问题都没有。那么我现在就给大家分享一下如何解决 ios 上面的问题啦。解决方法：直接在标签中加入style="-webkit-user-select:text !important" contenteditable="true" 这些代码即可。这里举个栗子： <textarea id="test" styl

解决h5页面在ios端输入框失去焦点后页面不回弹或者底部留白问题（小程序内webview嵌入的h5也适用）

一键写代码的博客

07-02

1502

方法就是在输入框失去焦点后（关闭键盘）让页面滚一下（select 标签导致页面底部留白此方法行不通，当用户未改变select 选中的项就关闭选择框不能触发 change 事件，当用户选中后关闭选择框也不会触发blur事件, 除非点击非select 区域才会blur） 1、原生页面 const windowHeight = window.innerHeight input.addEventListener('blur', function () { let windowFocusHeight = wi

解决ios环境下点击输入框页面被顶起不能自动回弹到底部问题

YY110621的博客

02-25

8197

前几天开发中遇到的问题，vue移动端页面，点击输入框页面被顶起不能自动回弹到底部，底部会留白问题。网上查了很多方法试过都没用，最终还是找到了一个很有用的解决方式，下面提供解决方法，有需要的直接可以拿去用先看下问题的效果图吧： ios环境下点击输入框页面被顶起不能自动回弹到底部，底部留白问题第一步：在页面的输入框中添加获取焦点事件代码写法： @focus="getFocus" ...

input 输入框设置disabled属性后，文本在ios端看不到，出现兼容性问题

LiYinghao_的博客

05-29

458

当input输入框设置disabled属性后，输入框内文本在ios端看不到。

ios中input内容看不见

marsnbsn的博客

05-16

594

做移动端和pc端的双端页面，会发现一些css属性兼容性问题，平时在电脑谷歌浏览器调试和开放多，所以放到真机测试有时候会有一些差别。1、在ios的safair浏览器中input框的line-height有兼容性问题，会导致内容偏移看不见，尝试使用line-height：noraml属性，惊奇的发现解决了！2、在ios的safair浏览器中，不支持gap（弹性盒子）属性。这里记录一下遇到的问题。

苹果手机input输入文字消失,看不见

weixin_30343157的博客

07-09

1675

这里的方法是: 原来字体是12号,改成15号或其他大一点的字号转载于:https://www.cnblogs.com/init-007/p/11157288.html

IOS H5 输入框输入后不显示内容，需要失焦后才显示

m0_37634363的博客

06-16

763

input 框输入文本后，还在 focus 的状态，输入的内容显示空白，点击完成失去焦点后内容才出来解决方案： input 框增加一个样式 transform: translateZ(0);

iOS开发 - 设置placeholder无效？

CodingFire的博客

11-30

3343

平日里设置placeholder并没有注意过，近日发现设置的placeholder颜色没了，查证后才发现，并不是方法无效了，而是位置关系：[textField setValue:[UIColor orangeColor] forKeyPath:@"_placeholderLabel.textColor"];textField.placeholder = @"请输入账户名";我这么写是无效的，但是这两

ios中input:disabled文本不显示

chuxuezhe__1的博客

10-15

1327

之前在联调时遇到了ios系统中input框禁用时，文本内容不显示的问题。在查询相关资料后发现ios系统默认disabled属性时透明度为0.3，这就导致了在视觉效果上文本不显示，解决方法如下： 1、设置透明度和填充色 input:disabled,input[disabled]{ -webkit-opacity:1; opacity: 1; color:#ccc; webkit-text-fill-color:#ccc; } 2、不用disabled，用readonly属性该属性在使用时会出现bug

input 在 IOS 中输入内容不可见问题

Corgi_的博客

07-30

3615

第一次做移动端页面，就发现很多兼容性问题了。本人一般是在Chrome浏览器控制台调试移动端样式尺寸，但是大家都知道，真机和浏览器是有一些差距的。然后这个问题卡了很久，各种百度，也没有找到想要的。如图问题描述：行高（自己编的，还是别的什么...）偏上，输入内容透明不可见的，光标也能移动。我是要正常输入文本，安卓机是正常OK的，就是Safari 会出现这个问题。解决方法：后来是在找...

解决浏览器中点击input输入框时，placeholder的值不消失的方法

lianwenxiu的博客

02-23

8483

<input type="text" placeholder="请输入" onfocus="this.placeholder=''" onblur="this.placeholder='请输入'">

Bug: Safari浏览器input框placeholder和内容都不显示

彭世瑜的博客

06-24

1704

input 增加一个样式 line-height:1

uniapp手机键盘输入英文input输入框获取不到值

关于 input 输入框 在 ios 端 placeholder 显示不全 输入的 文字 显示不全问题

关于 input 输入框在 ios 端 placeholder 显示不全输入的文字显示不全问题