去除iphone中Safari给按钮默认添加的UI样式

之前在做一个活动页面,里面用到了 input 的 button,写完样式在安卓手机上面测试没有问题,但是在iPhone的Safari中的样式完全变了。

在网上搜索了一下,原来是Safari默认添加上的样式。

而且不仅仅是button,还有submit,reset。

找到原因,赶紧解决,下面献上css代码:

input[type="submit"],
input[type="reset"],
input[type="button"],
button {
-webkit-appearance: none;
}

使用“-webkit-appearance”属性,能改变内核为webkit的浏览器任意元素的默认风格

时间: 2024-10-13 15:55:35

去除iphone中Safari给按钮默认添加的UI样式的相关文章

模仿iPhone中的返回按钮的css样式文件

css模拟苹果ios6风格按钮方法ios8的稍后奉上.先说ios6的.直接看代码:1.确定HTML的结构,用一个标签加伪类其实是不行的,所以我用了两个嵌套的标签 <a href="#"> <span>首页</span></a>2.首先想到的是右边一个标准Button,这个比较秒杀吧,所以不多说了,上图和代码 header_1CSS Code.btn-back span {        display: inline-block;    

Python读写excel练习_去除excel中乱码行,并添加列

需求: 把app_student.xls里面的数据, 1.如果这一行数据里面有乱码(及包含?),那么就删掉 2.再加上一列,是否毕业 3.如果班级是天蝎座的话,毕业这一列写成毕业 4.其他班级的写成未毕业 原始数据: 实现: import xlrd,xlwt EXCEL_NAME = 'app_student.xls' def delete_messy_code(excel_name): #删除乱码 book = xlrd.open_workbook(excel_name) sheet = bo

iphone中 input圆角bug

今天写了个简单的登录注册,在电脑手机(除了iphone)样式都没有问题,但在iphone中却出现了异常,提交的按钮变成圆角被背景渐变的效果,随后又测试两个iphone版都是一个样,断定应该是safari惹的祸. 如图:    搜索一番,果然,是iphone将<input type="submit">和<input type="reset">被safari浏览器解析默认会有个样式,添加圆角边,背景渐变. 解决办法,很简单: input{-web

iPhone 禁止 Safari 页面上下拖动反弹

解决方法: <body ontouchmove="event.preventDefault()"  > 手机端设置: <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">     <meta content="yes" name="

修复iPhone的safari浏览器上submit按钮圆角bug

今天在公司写了一个登录页面效果,让我碰到一个怪异的问题——"表单中的input type=submit和input type=reset按钮在iPhone的safari浏览器下圆角有一个bug”很是疑惑,于是搜集整理一番,下面我来简单的描述一下这个bug的样子 自从完成上次iPhone的几个页面效果后,一直在没有制作iPhone的页面效果了,今天在公司写了一个登录页面效果,让我碰到一个怪异的问题——“表单中的input[type="submit"]和input[type=&q

HTML5:去除IE10中输入框和密码框的X按钮和小眼睛

在IE10和之后的IE版本中,当在输入框和密码框中输入的时候,后面会自动出现X按钮和小眼睛,如下图所示:  令人苦恼的是,这个效果只有IE才有,其它浏览器是没有这个功能的.为了统一,我们就需要去掉这个功能,做法也很简单,直接在CSS中添加如下语句即可: /* 去除IE输入框的X标记 */ input[type=text]::-ms-clear { display: none; } /* 去除IE输入框的小眼睛标记 */ input[type=password]::-ms-reveal { dis

iphone中button按钮显示为圆形解决

iphone中button按钮显示为圆形解决: 添加样式: -webkit-appearance:button; 如果需要为直角: border-radius:0 在源码中添加如:style="-webkit-appearance:button;border-radius:0" 在外链中添加   :-webkit-appearance:button;border-radius:0

JS IOS/iPhone的Safari不兼容Javascript中的Date()问题

1 var date = new Date('2016-11-11 11:11:11'); 2 document.write(date); 最近在写一个时间判断脚本,需要将固定好的字符串时间转换为时间戳进行比较,在做的时候个人习惯使用chrome作为调试工具, 代码基本完成之后,一切正常: 使用其他浏览器访问,好嘛,IE跟safari都不兼容,返回错误"Invalid Date". 想着估计是字符串格式的问题,改成'2016/11/11 11:11:11'再测试,结果正常,以为这样应该

[iTyran原创]iPhone中OpenGL ES显示3DS MAX模型之二:lib3ds加载模型

[iTyran原创]iPhone中OpenGL ES显示3DS MAX模型之二:lib3ds加载模型 作者:u0u0 - iTyran 在上一节中,我们分析了OBJ格式.OBJ格式优点是文本形式,可读性好,缺点也很明显,计算机解析文本过程会比解析二进制文件慢很多.OBJ还有个问题是各种3D建模工具导出的布局格式还不太一样,face还有多边形(超过三边形),不利于在OpenGL ES里面加载. .3ds文件是OBJ的二进制形式,并且多很多信息.有一个C语言写的开源库可以用来加.3ds文件,这就是l