我的输入有一条奇怪的灰线,但仅在iPhone上。 在非移动浏览器上为纯白色输入。 我没有android,所以我无法测试它是否仅是iPhone。 有什么解决方案可以使输入完全变为白色?

输入灰线图像

HTML:

<input class="bt-email" type="email" name="email" placeholder="enter email address">
<input class="bt-submit" type="submit" value="let's get moving!">

CSS:

.bt-email {
   color: #1795db;
   display: inline-block;
   margin: 0 auto;
   height: 30px;
   font-family: 'Lato', serif;
   font-weight: 300;
   padding-left: 15px;
   text-decoration: none solid rgb(56, 64, 71);
   width: 90%;
   background: #ffffff;
   border: 4px solid #ffffff;
   border-radius: 5px 5px 5px 5px;
}
.bt-email:focus {
   outline: #ffffff;
}
.bt-submit {
   color: #ffffff;
   display: inline-block;
   margin: 0 auto;
   height: 40px;
   font-family: 'Lato', serif;
   font-weight: 300;
   text-decoration: none solid rgb(56, 64, 71);
   width: 90%;
   padding-top: 4px;
   background: #fb7f2d;
   border: 1px solid #fb7f2d;
   border-radius: 5px 5px 5px 5px;
 }

===============>>#1 票数:1

我实际上偶然发现了我想要的答案。 似乎移动Safari在输入中添加了内部文本阴影。 这段代码解决了它:

CSS:

-webkit-appearance: none;

解决了我的问题的相关问题

===============>>#2 票数:0

尝试删除4px边框,然后添加

 padding:4px;

而是通过将其添加到现有填充中

===============>>#3 票数:0

是的,非常简单。

你试一试

input {-webkit-appearance: none;}

  ask by Ryan Salmons translate from so

未解决问题?本站智能推荐:

1回复

Shadowbox YouTube视频未出现在iPhone设备上

http://www.execairshare.com/about-us/testimonials 是否有人在将影子影片加载到Shadowbox中而无法在iPhone上观看时遇到问题? 在其他移动设备上,它可以正常工作,但在iPhone上,它仅显示一个空白的黑框。 我假设这是一件事?
1回复

所有文字在移动网站上都放在哪里? 元素未出现在iPhone上。

我为父亲创建了一个网站,以帮助我进入设计学校。 将其上传到父亲使用的网络托管站点后,我发现在iPhone上打开该站点时,所有文本(或大部分文本)完全消失了。 我不确定该怎么做,因为当我通过Chrome开发者工具,JsFiddle等测试该网站时,似乎还不错。 该站点非常简单,因此我使用Fle
1回复

CSS-移动按钮出现在不同区域,不同设备中

我的混合移动应用程序中有一个按钮,当在iPhone 5上查看时,该按钮位于我想要的区域(中间)。 当我在iphone 6上查看它时,它会四处移动,现在我知道这是因为我的css非常具体,但是我想知道是否能获得一些指导,说明如何将按钮定位在设备之间(相同位置)。 这是我的CSS,所有帮助
3回复

CSS背景没有出现在手机上

在移动设备(特别是iPhone)上查看网站时,我的背景图像无法正常显示,我遇到了问题。 我可以在那里看到它不在正确的地方。 我附加了一个图像链接,显示了背景的呈现方式以及指向该网站的链接。 如果有人有解决这个问题的答案我会非常感谢任何建议。 提前致谢。 http://mik
7回复

只有1像素的间隙才会出现在iPad上但在Safari和Chrome上却很好

云端的这条线路 只能在iPad或iPhone上看到 。 知道怎么解决吗? 在所有其他桌面浏览器中都可以。 CSS
1回复

iPhone6 Plus中缺少字段集边框

我正在网站的响应部分上工作,在iPhone 6 plus中,缺少字段集边框(纵向和横向模式)。 我在iPhone 6 plus的其他响应站点(w3schools)上检查了fieldset元素,在纵向模式下我可以看到边框,但在横向模式下它消失了。 对于所有设备(iPhone和iPad)
2回复

输入文字在iPhone Safari和Chrome浏览器中不可见

在此,中断时间标签具有输入字段,而我在此输入字段中键入时,在iphone中不可见。[此项目中的所有输入字段] 当我在输入字段中键入内容时,它在chrome,safari,firefox等iphone浏览器中不可见,但在android浏览器中工作正常。
1回复

bottom:0在iPhone中出现问题

大家好,我的网站上有以下社交媒体和图标: 我应用了以下CSS: 正如您看到的bottom:0 ,这是社交媒体图标在移动设备上的外观: 但是在iphone6中,这会导致以下问题: 看看iphone底部栏如何覆盖社交图标,如何克服? 是否可以使用本机ipho
1回复

仅在iPhone上出现的电子邮件通讯中的奇怪缺口

我正在开发电子邮件时事通讯,并且在iPhone上需要测试的所有电子邮件客户端(AOL,Hotmail,Yahoo,Gmail,Outlook,Lotus Notes,Thunderbird等)中看起来都很不错。 甚至iPad看起来也不错,所以这不是iOS设备。 我使用了基于表格的布局,并且正
1回复

Android / iPhone中的CSS

我需要有关Android和iPhone的HTML 5中的页面的帮助。 它应该包含两个链接,它们在屏幕底部的百分比为5%。 我尝试通过放置具有绝对位置和底部5%的表或div使用CSS。 但是,这种decoupled的虚拟键盘在出现时会链接到虚拟键盘上方,并在站点返回时消失。 我尝试不在页脚