苹果手机上input的button按钮颜色异常

在手机端上写了一个页面,按钮的地方是用input标签button按钮,给的是绿色的背景颜色,在安卓手机上显示正常,在苹果手机上显示不正常,如下图

解决办法:

css加上下面这一行代码就可以了,input[type=button], input[type=submit], input[type=file], button { cursor: pointer; -webkit-appearance: none; }

希望能帮到你~

时间: 2024-10-08 22:48:43

苹果手机上input的button按钮颜色异常的相关文章

在苹果手机上input有内阴影怎么去除

一个input中在安卓手机上完全按照自己的样式去展示,但是在苹果手机上发现Input有内阴影,怎么去除内阴影呢? 在input样式中这样添加 #div{ .... appearance:button; -moz-appearance:button; /* Firefox */ -webkit-appearance:button; /* Safari 和 Chrome */ }

遭遇input与button按钮背景图失效不显示的解决办法

笔者从事网页前端代码页面工程师已有多年,作为一个网页重构人员常常会遇到一些莫名其妙的DIV+CSS(正确的说法是XHTML+CSS)在 IE.FireFox火狐. 谷歌浏览器CHROME.苹果浏览器Safari.Opera下不兼容的问题,其中IE6最为棘手,历来IE6就被诸位前端代码人员所诅咒,无奈其用户在 中国大陆又非常多!可恶的微软啊,你当年造IE6的时候为何不严格遵守W3C标准呢? 今天做公司的交友网站前端网页页面的时候笔者又遇到了难解决的网页前端DIVCSS代码问题,一个平时不会发生的怪

苹果手机input框上方有一条阴影线以及input框的placeholder颜色的设置

今天做手机端的时候,用到input框来输入手机号码,但是在安卓手机上input的效果是正常的,在苹果手机上,input的上边框会变粗,有阴影 因为苹果手机的默认给input加上了阴影 给input加入一下代码就解决这个问题了: input { border: none; outline: none; -webkit-appearance: none; -webkit-appearance: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

input标签设置背景颜色

给input的button按钮的点击事件添加背景颜色变化 1. $("#aa").style.backgroundColor = 'red'这种写法报错 2. $("#aa").css("background-color","gray");这种写法可以实现背景色的改变 原文地址:https://www.cnblogs.com/bulata/p/8176807.html

input[type='submit']input[type='button']button等按钮在低版本的IE下面,去掉黑色边框的问题

今天做一个tabs效果的时候,发现上面的button在低版本下会出现黑色的边框,很难看,于是我整理了下几个去掉黑色边框的办法: 1.在button的外层嵌套一个div,设置button的border:none; <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <st

页面table的每行都有一个&lt;input type=&#39;button&#39; /&gt;,如何实现点击按钮在按钮下方弹出一个div,点击空白消失

\ <input id="test" type="button" />/*按钮*/ <div id="tanchu"></div> <script language="javascript"> $(document).ready(function(e) { $("#test").click(function(e) { $("#tanchu"

input 和 button元素 作为提交、重置、按钮功用的区别。

首先,input元素和button元素 都是可以作为普通按钮.提交按钮.重置按钮的. <input type="button" value="button"> <input type="submit"> <input type="reset"> input元素默认 text类型 <button type="button">button</button&g

表单提交按钮input和button、a的差异

现在普遍的在网页中,表单提交数据的按钮最常见实用有三种,一种是input,一种是button,最后一种,是其他如a标签,div标签,span标签代替而来.在以前的日子里,大家都习惯于用input,因为他直接拥有type=submit,而button没有,它更适合于表达 button.然而... 首先我们说说:input标签:这个最常见了,不多说:当type="submit"时,提交表单数据! button标签:经过测试:在<IE8浏览器,button的默认type="b

vue中,点击button按钮后,页面上的input框自动聚焦

需求:点击button按钮,录入成功后,页面上的input框自动聚焦,快速进行下一次录入,提高效率 开始尝试了几种方法都没有成功 一.首先想到的用vue指令 v-focus,然而没有成功 <Input v-model="book.isbnOrIssn" @change.native="_getIsbn" @blur="_getIsbn" :disabled="snDisabled" v-focus placeholder