去掉iPhone、iPad的默认按钮样式 去掉高光样式:
input[type="button"], input[type="submit"], input[type="reset"] {
-webkit-appearance: none;
}
textarea { -webkit-appearance: none;}
1、去除Chrome等浏览器文本框默认发光边框
|
|
input:focus, textarea:focus { outline: none;} |
去掉高光样式:
input:focus{
-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-user-modify:read-write-plaintext-only;
}
当然这样以来,当文本框载入焦点时,所有浏览器下的文本框的边框都不会有颜色上及样式上的变化了,但我们可以重新根据自己的需要设置一下,如:
|
|
input:focus,textarea:focus { outline: none; border: 1px solid #f60;} |
这样的话,当文本框载入焦点时,边框颜色就会变为橙色,给用户一个反馈。
2、去除IE10+浏览器文本框后面的小叉叉
只需下面一句就ok了
|
|
input::-ms-clear { display: none;} |
3、禁止多行文本框textarea拖拽
这样按下面添加属性多行文本框就不能拖拽放大缩小了:
|
|
textarea { resize: none;} |
在这里要提到一个属性resize,这个是CSS3属性,用于元素缩放,它可以取以下几个值:
none 默认值
both 允许水平方向及垂直方向缩放
horizontal 只允许水平方向缩放
vertical 只允许垂直方向缩放
不仅可以针对textarea元素,对大多数元素都适用,如div等,在这里不一一列举,但与textarea不同的是,对div使用时需要加上一句overflow: auto;,也就是这样才有效果:
|
|
div { resize: both; overflow: auto;} |
哦了,以上就是关于去除表单浏览器默认样式的一些内容。
去掉iPhone、iPad的默认按钮样式 去掉高光样式:的更多相关文章
- css去掉iPhone、iPad默认按钮样式
原文链接:http://blog.sina.com.cn/s/blog_7d796c0d0102uyd2.html 只要在样式里面加一句去掉css去掉iPhone.iPad的默认按钮样式就可以了!~ ...
- 去掉iPhone、iPad的默认按钮样式
只要在样式里面加一句去掉css去掉iPhone.iPad的默认按钮样式就可以了!~ input[type="button"], input[type="submit&qu ...
- 使用 CSS 去掉 iPhone 网页上按钮的超大圆角以及文本框圆角默认样式
使用 iPhone 上的浏览器去浏览网页的时候,按钮总是显示超大圆角且颜色由上而下渐变的样式,显得超级恶心,而且文本框也会有一定的圆角,但是我们自己定义 border-radius 也没有效果,经过搜 ...
- 去掉iphone手机滑动默认行为
/*去掉iphone手机滑动默认行为*/ $('body').on('touchmove', function (event) { event.preventDefault(); });
- CHROME下去掉保存密码后输入框变成黄色背景样式
之前没遇到过这种情况,现在打开这个页面后,手机号和密码都已经输入了,而且还显示的是黄色背景,清了下cookie,没有解决问题.请教了下大神,先把方法整理到这儿. 用代码审查看了input样式有如下样式 ...
- iPhone/iPad/Android UI尺寸规范 UI尺寸规范,UI图标尺寸,UI界面尺寸,iPhone6尺寸,iPhone6 Plus尺寸,安卓尺寸,iOS尺寸
iPhone/iPad/Android UI尺寸规范 UI尺寸规范,UI图标尺寸,UI界面尺寸,iPhone6尺寸,iPhone6 Plus尺寸,安卓尺寸,iOS尺寸 iPhone界面尺寸 设备 分辨 ...
- Glyphish – 精心打造的 iPhone & iPad 应用程序图标
Glyphish 是一套精心打造的图标库,包含 iOS 工具栏.标签栏.导航条等等,Glyphish 图标也完美的用在 Android.Windows Mobile App 和移动网站的 UI 设计等 ...
- 通过Mac远程调试iPhone/iPad上的网页(转)
我们知道在 Mac/PC 上的浏览器都有 Web 检查器这类的工具(如最著名的 Firebug)对前端开发进行调试,而在 iPhone/iPad 由于限于屏幕的大小和触摸屏的使用习惯,直接对网页调试非 ...
- 体验应用程序在Mac/iPhone/iPad之间的Handoff
对于苹果新推出的Handoff功能,之前只体验了接电话的Handoff.一个电话打过来,iPhone/iPad/Mac同时响起,这时如果手上拿着东西在吃,就可以直接在Mac上接电话. 除此之外,还可以 ...
随机推荐
- C++ create_task详解
IAsyncOperation<T>^ asyncOperation = create_async( []() { return create_task(FirstAsync(...)) ...
- JIRA学习一:Windows下安装破解JIRA6.3.6
安装环境: WindowsXP MySQL-5.5.28 JDK1.6.0_21 JIRA功能全面,界面友好,安装简单,配置灵活,权限管理以及可扩展性方面都十分出色. 一.MySQL建库和建账号 1. ...
- 虚拟机安装的UBUNTU怎么全屏
虚拟机下面安装了ubuntu系统,显示的屏幕只有那么一小块儿,不知道如何才能全屏,那么如何全屏呢?且看下面经验. 步骤阅读 百度经验:jingyan.baidu.com 方法/步骤 1 打开虚拟机 ...
- GNU Trove trove4j
GNU Trove (http://trove4j.sourceforge.net/) 是一个Java 集合类库.在某些场景下,Trove集合类库提供了更好的性能,而且内存使用更少.以下是Trove中 ...
- velocity模板引擎学习(4)-在standalone的java application中使用velocity及velocity-tools
通常velocity是配合spring mvc之类的框架在web中使用,但velocity本身其实对运行环境没有过多的限制,在单独的java application中也可以独立使用,下面演示了利用ve ...
- ubuntu13.04环境hadoop1.2.1单机模式安装
一.虚拟机上安裝ubuntun 13.04 中文版 当然,你要是习惯看英文版,也可以直接安装英文版.老老实实从官网下载安装即可,安装系统不是本文的重点.这里只提一个注意事项:新手安装前,切记断网,因为 ...
- 细细品味Storm_Storm简介及安装
Storm是由专业数据分析公司BackType开发的一个分布式实时数据处理软件,可以简单.高效.可靠地处理大量的数据流.Twitter在2011年7月收购该公司,并于2011年9月底正式将Storm项 ...
- spring注解scheduled实现定时任务
只想说,spring注解scheduled实现定时任务使用真的非常简单. 一.配置spring.xml文件 1.在beans加入xmlns:task="http://www.springfr ...
- K-means算法及文本聚类实践
K-Means是常用的聚类算法,与其他聚类算法相比,其时间复杂度低,聚类的效果也还不错,这里简单介绍一下k-means算法,下图是一个手写体数据集聚类的结果. 基本思想 k-means算法需要事先指定 ...
- 我所认识的javascript正则表达式
前言 如果说这是一篇关于正则表达式的小结,我更愿意把它当做一个手册. 目录:(点击可直达) RegExp 三大方法(test.exec.compile) String 四大护法(search.matc ...