IOS按钮样式覆盖

最新推荐文章于 2022-04-01 22:36:31 发布
最新推荐文章于 2022-04-01 22:36:31 发布
阅读量437 收藏
点赞数
分类专栏： H5开发 苹果兼容性 文章标签： 苹果按钮样式 ios样式问题 H5开发样式兼容性 苹果按钮兼容性问题
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ze1024/article/details/96437687
版权

自己开发了一个H5的应用，没有引用插件，在设置按钮样式的时候，发现在苹果手机上的按钮样式显示的不一样，所以找了一下原因。
原因：苹果手机自带样式把我设置的样式给覆盖掉了
解决方法:在css文件中加一句代码


input[type=button], input[type=submit], input[type=file], button { cursor: pointer; -webkit-appearance: none; }

这样子就解决了

ze1024
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
iOS 自定义UIButton
-此夜微凉
11-22 3280
UIButton的默认布局是:title在右,image在左; 很多时候我们需要的是title在左边,或者title在下面,这时就需要调整UIButton的TitleLabel和ImageView的位置了,查了很多资料,要么零零散散的介绍,要么就是特别复杂的实现;经过一段时间的学习,在这里总结一下实现的方式; 一种是设置UIButton的以下两个属性:@property(nonatomic) U
组件需要覆盖下面的按钮样式
夏天的博客
03-14 718
地图检索组件需要覆盖下面的按钮样式 需求：地图组件打开需要覆盖下面的按钮的样式 存在的问题：按钮样式显示在地图组件的上方，并且改变层级没有用 我的思路：一直在用那个z-index，想改变样式。但是就是改变不了 解决方案：是在按钮添加v-show,里面定义一个变量，接着设置bm-local-search里面的方法，方法里面写与设置的变量相反的值。 思路差异：我一直在纠结的是z-index层级的变化，而不是换一个思维去考虑按钮的显示，还有就是没考虑是这个组件bm-local-search的调用方法，这是我没有想
Qt自绘控件-IOS风格开关按钮
tth0225的博客
07-10 522
Qt自绘控件之-IOS风格开关按钮，带有简单动画，还可以显示文字 #include "SwitchButton.h" SwitchButton::SwitchButton(QWidget *parent) : QWidget(parent) , m_bChecked(false) , m_bShowText(true) { this->setMinimumSize(30, 20); QFont font; font.setFamily("Consolas"); font.setP
tailwindcss + element plus 自动引入时，el-button样式被覆盖的问题
weixin_45042868的博客
04-01 6052
问题描述 在安装了tailwindcss + element plus 时，会发现el-button的样式被tailwindcss的样式给覆盖了，（目前也只遇到button被覆盖的情况）。 问题分析 是样式加载顺序的问题 解决办法 https://github.com/element-plus/element-plus/issues/5693 全部引入时 可以通过调整引入element plus的样式和tailwindcss的样式的顺序 先引入tailwindcss的样式，然后在引入element plus
ios-多种按钮样式.zip
07-11
多种按钮样式（带图标筛选按钮视图、多按钮选择滚动视图……） SYButtonView：https://github.com/potato512/SYButtonView
关于IOS设备，按钮样式显示的问题解决方案。
iammarrio的博客
11-02 1586
其实这就是，不同内核之间的小区别了，也就一个属性，加上就好。希望对小伙伴们有所帮助。 在css中加上   input[type=button],input[type=submit],input[type=file],button{ cursor: pointer;  -webkit-appearance: none; //将webkit内核的样式设置为none即可}
详解iOS自定义UITabBar与布局
01-05
在小编整理过的文章iOS项目基本框架搭建中，我们详细说明了如何对TabBarItem的图片属性以及文字属性进行一些自定义配置。但是，很多时候，我们需要修改TabBarItem的图片和文字属性之外，还需要自定义TabBarItem的...
tingle-style:tinglejs的基本样式
04-29
tingle-styletingle-style是tingle的底层样式实现...input, textarea消除输入框和按钮的原生外观去掉点击链接和文本框对象时默认的灰色半透明覆盖层(iOS)或者虚框(Android)and more...更多的reset不再一一列举，详见原
封装项目开发常用的网络请求框架
04-05
封装自定义的TabBar(可带中间加号按钮，微博样式) .3）.封装自定义的NavigationBar,系统原生和完全自定义类型,可随时变动左右item样式及响应,titleLabel多样式. 4）.loading覆盖层,空白页面指示框. 5）.常用的字符串...
MAFActionSheetController:适用于iOS 7+的通用可定制动作表控制器
05-17
MAFActionSheetController使用MAFOverlay来管理iOS 7+上动作表样式的视图控制器，以呈现为条形按钮项或视图的覆盖图。 ＃＃ 细节 与UIAlertController相似，但是可以完全控制布局，并且可以与iOS 7+一起使用。 ...
CSS3实现多种颜色的底部阴影按钮特效
05-29
css3实现多种颜色的底部阴影按钮特效,鼠标经过按钮,还会出现过渡效果！非常不错的css3按钮。按钮是一款纯css3实现的膨胀修边阴影背景按钮。...已覆盖Android、iOS、WP、Symbian、Kjava操作系统平台。
input type=button按钮样式在ios系统下的渲染效果和android效果不一样
感恩、奋进、自信
12-08 6136
input type=button按钮样式在ios系统下的渲染效果和android效果不一样 1、html如下： 2、在android机下按钮显示的效果如下：      3、在IOS系统下按钮显示的效果是：有渐变的效果-由白变灰 4、原因：IOS下有默认的按钮渲染方式（颜色渐变和圆角） 5、解决方法：添加样式  -webkit-ap
手机端的各种默认样式比如 ios的按钮变灰色
wjy397的专栏
02-19 4155
1.ios按钮变灰色,给按钮加样式: -webkit-appearance: none; 2.有圆角话 .button{ border-radius: 0; } 3.去除Chrome等浏览器文本框默认发光边框 input:focus, textarea:focus { outline: none;} 4.去掉高光样式： input:focus{
在IOS环境下移除原有按钮样式
qq_37816525的博客
06-24 221
-webkit-appearance: none; 例： input{-webkit-appearance: none;}
CSS 修改 IOS 默认按钮样式
weixin_34101784的博客
05-31 321
不知道大家在做移动端页面的时候有没遇到过在 IOS 端 一些按钮显示和安卓的截然不同，今天下午又有一个小伙在群里问这个问题。我记得之前我也遇到过，今天给大家分享一下怎么使用CSS修改IOS的默认样式。========================================================小月博客http://www.aliyue.netWEB====...
iOS基础-系统自带按钮样式- UIBarButtonSystemItem
weixin_30362083的博客
12-17 316
系统按钮 除了图像与文字按钮，还有一个小型的系统按钮库，可以创建那些在许多应用程序中都可以见到的标准化的预定义按钮。系统按钮也是UIBarButtonItem对象，可以通过类的initWithBarButtonSystemItem方法来创建。如下例： UIBarButtonItem*myBookmarks=[[UIBarButtonItemalloc] ...
css解决ios端按钮和输入框自带圆角的问题
vcxiaohan的博客
12-29 9321
请在这里查看示例 ☞ borderRadius示例问题重现在ios端，我们不想使用按钮或输入框自带的圆角样式，改如何取消呢？问题解决 源码如下<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1,
IOS-按钮风格style（plain、bordered、done）辨析
weixin_30462049的博客
06-05 364
style定义按钮的风格。可用的风格有： UIBarButtonItemStylePlain 默认按钮风格；按下时会闪动 UIBarButtonItemStyleBordered 与UIBarButtonItemStylePlain相同，但显示的按钮有边框 UIBarButtonItemStyleDone 显示一个蓝色按钮，提醒用户编辑完毕时应...
在Android中自定义IOS风格的按钮
::: 移动互联网时代开发者 :::
06-21 4366
IOS风格的UI比较流行，很多Android的UI设计者也愿意将Android的UI设计成类似IOS系统的UI风格。下面是一个例子，说明如何使用Shape来定义一个IOS风格的按钮。   定义一个ios_button_grouped.xml。 xmlversion="1.0"encoding="UTF-8"?> selector     xmlns:android="http://sch
css开关按钮样式
最新发布
05-31
可以使用以下 CSS 样式实现开关按钮： HTML 代码： ```html <label class="switch"> <input type="checkbox"> <span class="slider"></span> </label> ``` CSS 样式： ```css .switch { position: relative; display: inline-block; width: 60px; height: 34px; } .switch input { display: none; } .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; border-radius: 34px; } .slider:before { position: absolute; content: ""; height: 26px; width: 26px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s; border-radius: 50%; } input:checked + .slider { background-color: #2196F3; } input:focus + .slider { box-shadow: 0 0 1px #2196F3; } input:checked + .slider:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); } ``` 这个样式会生成一个类似于 iOS 开关按钮的样式，可以根据自己的需求进行修改。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值