如何去除苹果浏览器的自带HTML标签样式

最新推荐文章于 2021-10-11 16:35:57 发布
最新推荐文章于 2021-10-11 16:35:57 发布
阅读量2.8k 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： html+css 文章标签： html css 浏览器 苹果 标签
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_26291823/article/details/50811280
本文介绍了一种简单的方法来移除苹果浏览器中的默认HTML标签样式。通过在CSS中添加特定属性，可以有效地自定义和调整按钮等元素的外观。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

如何去除苹果浏览器的自带HTML标签样式

去除苹果默认样式，只要在css里加上：
-webkit-appearance:none;
就可以了，但是要注意一点，只是在你需要改变的HTML标签中加，比如

input[type=button]{ -webkit-appearance:none; outline:none }

这样来去除自带的button样式，如果在body中使用的话有可能会造成input输入框无法输入的情况

【前端基础篇】快速学习HTML常用标签和属性
前端知识分享喵
06-12 1692
WEB标准不是某一个标准，而是一系列标准的集合。网页主要由三部分组成：结构（Structure-html）、表现（Presentation-css）和行为（Behavior-javascript）。对应的标准也分三方面：结构化标准语言主要包括XHTML和XML，表现标准语言主要包括CSS，行为标准主要包括对象模型（如W3C DOM）、ECMAScript等。
去除苹果手机select 默认样式
weixin_zsh的博客
08-28 7744
主要用的是 -webkit-appearance: none;/*兼容苹果手机*/ 这是一个小demo <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text
CSS3 重置iphone浏览器按钮input,select等表单元素的默认样式
09-25
之前写了一个登录表单页面，再iphone上测试遇到了一些奇怪的问题：表单中的input[type="submit"]按钮在iPhone的safari浏览器下会出现圆角的情况；input[type="text"]文本输入框会有内阴影，这些问题该怎么处理呢？请看下
去苹果浏览器默认样式
@木尘的小博客
08-06 1702
去苹果浏览器默认样式input,textarea,button { -webkit-appearance: none; border-radius:0px; border:none;}
苹果原生浏览器中默认样式如何清除
zhang_s的博客
10-11 810
在css样式中加入以下代码： input[type="submit"], input[type="reset"], input[type="button"], button { -webkit-appearance: none; }
去掉苹果默认样式
当下的七炎
11-01 777
-webkit-appearance: none;
去除IOS苹果手机自带按钮样式的方法(推荐)
08-28
本篇文章将详细介绍一种推荐的方法，帮助开发者去除iOS苹果手机自带的按钮样式。 首先，我们需要了解的是，iOS设备的Safari浏览器和其他基于WebKit的浏览器，会在默认情况下为`<input>`标签中的`type="button"`, `...
Safari浏览器自定义CSS样式表
01-23
1、全局正文苹方字体 ...4、针对Mac电脑的Safari浏览器进行了简单的适配优化 5、适用Mac端，不适用于Ios端 说明：用到了"SF Pro"英文字体和“SF Mono”等宽两种字体，可以到苹果官网下载安装，或下载后直接安装使用。
网页防封微信qq打开网页时提示浏览器打开，防止微信qq封杀网页
11-17
标题中的"网页防封微信qq打开网页时提示浏览器打开"指的是当用户尝试通过微信或QQ内置浏览器访问网页时，系统会自动弹出提示，建议用户使用系统自带的浏览器（如Safari、Chrome等）来打开网页。这样不仅可以提高用户...
微信提示 在浏览器打开 效果实现过程解析
10-16
// 如果使用的是微信自带浏览器，就打开蒙版 if (isWeixin) { var SHOW = 0; document.getElementById('Mask').style.display = ++SHOW % 2 == 1 ? 'block' : 'none'; } ``` 在这个JS代码中，`SHOW`变量用于...
safari下载文件自动加了html后缀问题
12-18
如何下载文件？ 方法一、直接通过nginx下载静态文件 如果文件是保存在服务器上面的，可以直接用nginx下载文件 比如说可以供用户下载pdf文件，那么我的nginx配置可以是这样子的： location ~ /document/(.*)\.pdf$ { root /home/nemo/myfile; try_files /$uri 404; } 按照上面的配置，当我请求 http://fbd.intelleeegooo.cc/document/test.pdf 的时候，我服务器上的位于 /home/nemo/myfile/document/test.pdf 的这个文件就被下载了。
html5取消样式,ios html5 网页取消默认样式
weixin_34748612的博客
07-09 456
ios的的默认样式修改成扁平化的样式重要的一句css -webkit-appearance: none;将样式清除单数会出现将raido的选择按钮也会消失所以需要对radio的样式进行重新设置设置input框的样式input[type="text"]{-webkit-appearance: none; font-size: 12px;}设置radio选择之前和之后的样式input[type=...
css去除苹果默认样式
aoxi9939的博客
11-15 585
input[type="button"], input[type="submit"], input[type="reset"] { 　　-webkit-appearance: none; } textarea { 　　-webkit-appearance: none; } /*以及圆角*/ .button{ border-radius: 0; } 转...
html 去除苹果默认,iOS设置上的1应该怎么去掉 iPhone设置上的1去掉方法
weixin_42517317的博客
06-17 3278
不知道大家有没有这样的疑问，那就是我们iPhone手机设置经常出现一个红色数字1，对于大部分玩家来说以为是系统需要更新推送，但进入软件关系其实并没有新的系统推送，那么这是怎么回事呢？对于这个问题，通过自己的设备为大家解答一下。不知道iOS设置上的1怎么去掉的用户，不妨来看看小编为大家带来的iPhone设置上的1去掉方法。先说明一下小编设备情况，系统版本是iOS12 beta12最新测试版，那就是说...
防止html5的video标签在iphone中自动全屏
weixin_30764883的博客
09-25 814
　　问题: 当在iphone中打开html5页面中的video视频时，会默认调取系统播放器，全屏播放视频资源。 　　解决方式: 1. 首先在html5页面的video标签中添加webkit-playsinline=true; 　　　　　　　　<video id="player" webkit-playsinline></video> 　　　　　　　　接着在UI...
【CSS】去除input和textarea点击选中框
热门推荐
Mr_Wanter
11-24 2万+
我们在写表单的时候会发现一些浏览器对表单赋予了默认的样式，如在Chorme浏览器下，文本框及下拉选择框当载入焦点时，都会出现发光的边框，并且在火狐及谷歌浏览器下，多行文本框textarea还可以自由拖拽拉大，另外还有在IE10下，当文本框输入内容后，在文本框的右侧会出现一个小叉叉，等等。不容置疑，这些效果是在用户体验上得到了提升，但有些时候我们并不需要这些默认的样式，那怎么办呢？下面我们就来分别看...
CSS清除苹果原生浏览器中默认样式
weixin_43503730的博客
06-26 668
CSS清除苹果原生浏览器中默认样式 CSS 中加入以下代码即可实现清除默认样式： input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none;} textarea { -webkit-appearance: none;} // 如果存在圆角问题 .radius { border-radius:0px; } // 如果存在边框问题 .border { border: none }
用css去除chrome、safari等webikt内核浏览器的默认样式
sinat_33337475的博客
06-05 8046
在制作手机网站的时候用Safari 打开相应的页面，发现button,input,select,textarea都存在着默认的样式，我们设置的样式都被默认样式盖住了，这时只需要添加一个webkit的私有属性：            -webkit-appearance:none; 添加该样式，并且值为'none'时即可取消浏览器对于控件的默认样式。 appearance : 
h5页面底部吸底，在苹果浏览器吸底部分到导航栏下方
最新发布
04-01
在iOS Safari浏览器中，底部固定定位元素（如吸底按钮）可能被浏览器自带的底部导航栏遮挡，主要原因是iOS的视口高度计算方式与常规浏览器不同[^3]。当使用`position: fixed`时，元素会基于视口的初始高度定位，而...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值