IOS上的占位符文本输入
IOS上的占位符文本输入
提问于 2014-07-08 23:12:21
目前我有一个小问题，文本框中的文本占位符在IOS设备上查看时似乎没有显示，但在桌面和android上运行良好.
这只是一个简单的div，里面有一个输入字段。
这是我正在使用的代码：
<div id="em_inputs" class="hidden clearfix">
<input type="text" name="first_name" id="first_name" placeholder="First Name">
</div>
@mixin Opacity($value){
$IEValue: $value*100;
opacity: $value;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity="+$IEValue+")";
filter: alpha(opacity=$IEValue);
}
#em_inputs{
-webkit-appearance: none;
-webkit-border-radius:0;
border-radius:0;
overflow: hidden;
position: relative;
top: 127px !important;
width: 100%;
input {
overflow: hidden;
-webkit-appearance: none;
-webkit-border-radius:0;
border-radius:0;
border: none;
width: 100%;
padding: 12px 5px 11px 10px;
color: $text-white;
background: url("../img/bg_input.png") repeat 0 0;
margin: 10px 0 0 0;
@include Opacity(0);
position: relative;
top: -10px;
height: 3px;
overflow: hidden;
&:focus{
border: 2px solid $text-white;
}
}我还使用了这样的代码，使占位符文本变成白色，以防浏览器使用特殊规则。
::-webkit-input-placeholder {
color: white;
}
:-moz-placeholder { /* Firefox 18- */
color: white;
}
::-moz-placeholder { /* Firefox 19+ */
color: white;
}
:-ms-input-placeholder {
color: white;
}
::-webkit-scrollbar {
display: none;
}有人知道我在做什么吗？我不仅对修改代码感兴趣，而且还知道，如果有人在IOS占位符中遇到了同样的问题，通常会有点挑剔吗？
是否也是因为背景图像？
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-07-10 00:36:18
我找到答案了。
当更改设备的方向时，将显示占位符的文本。这改变了浮子。
我所做的是在页面完全加载之前，重新设置浮点，它可以工作。
这是帮助我走出困境的源头。
bug/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/24642969
复制相关文章
相似问题
腾讯云开发者
