首页/html5前端开发/解决ios safari中按钮圆角问题

解决ios safari中按钮圆角问题

发布-xiaoming | 浏览量-

 问题描述

  使用html5编写页面在移动app中嵌套,总会涉及到按钮的使用,在android手机浏览器中显示正常,但在ios safari浏览器中会看到按钮显示为圆角样式,设置border-radius:0也不好使,其实添加css  “-webkit-appearance”就能解决问题。
 
问题截图

 

 

css

input .btn

{

    display : inline-block ;

    height : 30px ;

    line-height : 30px ;

    border : 0 ;

    cursor : pointer ;

    font-size : 15px ;

    color : #fff ;

    font-weight : bold ;

    border-radius : 5px ;

    padding : 0px 20px;

    overflow : visible ;

    -webkit-appearance : none ;  /*解决iphone safari上的圆角问题*/

}

 

html

< input type ="button" class ="btn" />

总结

使用css样式-webkit-appearance: none;  轻松解决iphone safari上的圆角问题。

 

原文地址:http://www.35ui.cn/post/20150326357.html

标签ios

上一条: 2013年度最强AngularJS资源合集
下一条: js压缩工具|Javascript在线解压缩

或许你还对下面的文章感兴趣