【学习】苹果iPhone safari浏览器样式重置修复按钮圆角bug

iPhone safari浏览器中,input按钮会按苹果的默认UI来渲染,例如,写的按钮明明是这个样的:

但是实际就会是这个样子:

怎么办呢? 为按钮添加:-webkit-appearance: none; 即可解决!

时间: 2024-12-24 00:47:51

【学习】苹果iPhone safari浏览器样式重置修复按钮圆角bug的相关文章

苹果浏览器样式重置submit

大家刚接触写手机页面 或许都会遇到的 修复iPhone的safari浏览器上submit按钮圆角bug 修改前  修改后: 在CSS中加  -webkit-appearance: none; 便可以解决. 苹果浏览器样式重置submit

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

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

iphone safari浏览器CSS兼容性的解决方案集合

1.iphone safari不兼容CSS的active的解决方案如下: <body ontouchstart="" onmouseover=""> </body> 参考链接:http://stackoverflow.com/questions/8330559/hover-effects-using-css3-touch-events

CSS RESET —— 浏览器样式重置

CSS Reset 1. CSS Reset为什么存在? 只要您的客户存在使用不同浏览器(ie,firefox,chrome等)的可能,那你就不得不从完美的理想状态回到现实,因为不同核心的浏览器对CSS的解析效果呈现各异,导致您所期望的效果跟浏览器的"理解"效果有偏差,今天提到的css reset就是用来重置(复位)元素在不同核心浏览器下的默认值,尽量保证元素在不同浏览器下的同一"起跑线". --引用自关于CSS Reset 2. CSS Reset该怎么写? CS

解决ios safari中按钮圆角问题

问题描述 使用html5编写页面在移动app中嵌套,总会涉及到按钮的使用,在android手机浏览器中显示正常,但在ios safari浏览器中会看到按钮显示为圆角样式,设置border-radius:0也不好使,其实添加css  “-webkit-appearance”就能解决问题. 出处 : http://i.cnblogs.com/EditPosts.aspx?opt=1

css扁平化博客学习总结(二)css样式重置

css样式重置 方法一:不推荐使用,这么写会让网页解析速度变慢. *{ margin: 0; padding: 0;} 方法二:大家常用的写法,比较流行. body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol,li, dl, dt, dd, form, a, fieldset, input, th, td{margin: 0; padding: 0; border: 0; outline:

css基础样式重置,浏览器样式统一及IE下样式优化

/*样式重置*/ body,dl,dd,h1,h2,h3,h4,h5,h6,p,form{margin:0;} ul,ol{margin:0;padding:0;} h1,h2,h3,h4,h5,h6{font-weight:400;} input:focus,button:focus{outline:none;} a:focus{outline:none;} /*基础样式*/ body{font-family:"Microsoft Yahei";color:#000;font-siz

苹果safari浏览器window.open问题

现象:在做项目的过程中,使用window.open打开新窗口,在windows系统的ie,firefox,chrome浏览器上测试均没有问题,在苹果系统的safari浏览器上发现有些window.open可以打开选项卡,有些不可以打开 第一种可以打开选项卡 第二种则打不开选项卡 解决方案:百度发现"safari 中没办法在回调函数里面执行window.open, 原因是safari的安全机制将其阻挡了",解决办法就是在请求之前先打开一个空白窗口,在请求成功的回调函数里面:如果请求错误不

关于reset.css的疑问:为什么一定要重置浏览器样式?

自开始做前端算起,我所做过的每一个项目中都会有一个reset.css,也就是重置样式表.我现在想想都不知道第一次是从哪儿弄来的一个重置样式表.快五年了,好像从来都没有质疑过关于重置样式表的内容. 这样一个样式表里往往会有一大段对“浏览器样式”的清除与重置.刚开始做前端的时候一度感觉,能写出来这么一个样式表似乎很酷.很牛:做时间久了,也自己开始针对不同项目写自己的reset.css了,但也不外乎是一大堆重置样式,有时候都不关心浏览器里每个元素有什么样的默认样式,只是唯恐漏掉哪个元素没有把样式重置掉