input[type="button"], input[type="submit"], input[type="reset"] {

-webkit-appearance: none;

}

textarea {  -webkit-appearance: none;}

1、去除Chrome等浏览器文本框默认发光边框

 
 
 
input:focus, textarea:focus {
    outlinenone;
}

去掉高光样式:

input:focus{
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    -webkit-user-modify:read-write-plaintext-only;
}

当然这样以来,当文本框载入焦点时,所有浏览器下的文本框的边框都不会有颜色上及样式上的变化了,但我们可以重新根据自己的需要设置一下,如:

 
 
 
 
input:focus,textarea:focus {
    outlinenone;
    border1px solid #f60;
}

这样的话,当文本框载入焦点时,边框颜色就会变为橙色,给用户一个反馈。

2、去除IE10+浏览器文本框后面的小叉叉

只需下面一句就ok了

 
 
 
input::-ms-clear {
    displaynone;
}

3、禁止多行文本框textarea拖拽

这样按下面添加属性多行文本框就不能拖拽放大缩小了:

 
 
 
textarea {
    resize: none;
}

在这里要提到一个属性resize,这个是CSS3属性,用于元素缩放,它可以取以下几个值:

none 默认值

both 允许水平方向及垂直方向缩放

horizontal 只允许水平方向缩放

vertical 只允许垂直方向缩放

不仅可以针对textarea元素,对大多数元素都适用,如div等,在这里不一一列举,但与textarea不同的是,对div使用时需要加上一句overflow: auto;,也就是这样才有效果:

 
 
 
 
div {
    resize: both;
    overflowauto;
}

哦了,以上就是关于去除表单浏览器默认样式的一些内容。

去掉iPhone、iPad的默认按钮样式 去掉高光样式:的更多相关文章

  1. css去掉iPhone、iPad默认按钮样式

    原文链接:http://blog.sina.com.cn/s/blog_7d796c0d0102uyd2.html 只要在样式里面加一句去掉css去掉iPhone.iPad的默认按钮样式就可以了!~ ...

  2. 去掉iPhone、iPad的默认按钮样式

    只要在样式里面加一句去掉css去掉iPhone.iPad的默认按钮样式就可以了!~ input[type="button"], input[type="submit&qu ...

  3. 使用 CSS 去掉 iPhone 网页上按钮的超大圆角以及文本框圆角默认样式

    使用 iPhone 上的浏览器去浏览网页的时候,按钮总是显示超大圆角且颜色由上而下渐变的样式,显得超级恶心,而且文本框也会有一定的圆角,但是我们自己定义 border-radius 也没有效果,经过搜 ...

  4. 去掉iphone手机滑动默认行为

    /*去掉iphone手机滑动默认行为*/ $('body').on('touchmove', function (event) { event.preventDefault(); });

  5. CHROME下去掉保存密码后输入框变成黄色背景样式

    之前没遇到过这种情况,现在打开这个页面后,手机号和密码都已经输入了,而且还显示的是黄色背景,清了下cookie,没有解决问题.请教了下大神,先把方法整理到这儿. 用代码审查看了input样式有如下样式 ...

  6. iPhone/iPad/Android UI尺寸规范 UI尺寸规范,UI图标尺寸,UI界面尺寸,iPhone6尺寸,iPhone6 Plus尺寸,安卓尺寸,iOS尺寸

    iPhone/iPad/Android UI尺寸规范 UI尺寸规范,UI图标尺寸,UI界面尺寸,iPhone6尺寸,iPhone6 Plus尺寸,安卓尺寸,iOS尺寸 iPhone界面尺寸 设备 分辨 ...

  7. Glyphish – 精心打造的 iPhone & iPad 应用程序图标

    Glyphish 是一套精心打造的图标库,包含 iOS 工具栏.标签栏.导航条等等,Glyphish 图标也完美的用在 Android.Windows Mobile App 和移动网站的 UI 设计等 ...

  8. 通过Mac远程调试iPhone/iPad上的网页(转)

    我们知道在 Mac/PC 上的浏览器都有 Web 检查器这类的工具(如最著名的 Firebug)对前端开发进行调试,而在 iPhone/iPad 由于限于屏幕的大小和触摸屏的使用习惯,直接对网页调试非 ...

  9. 体验应用程序在Mac/iPhone/iPad之间的Handoff

    对于苹果新推出的Handoff功能,之前只体验了接电话的Handoff.一个电话打过来,iPhone/iPad/Mac同时响起,这时如果手上拿着东西在吃,就可以直接在Mac上接电话. 除此之外,还可以 ...

随机推荐

  1. POJ3783Balls[DP 最坏情况最优解]

    Balls Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 907   Accepted: 598 Description T ...

  2. 奇葩啊,HOLOLENS里模拟器截不了图,后台DEVIE PORTAL可以截

    奇葩啊,HOLOLENS里模拟器截不了图,后台DEVIE PORTAL可以截 截屏 https://developer.microsoft.com/en-us/windows/holographic/ ...

  3. 嵌入式Linux驱动学习之路(六)u-boot启动内核

    内核启动是需要必要的启动参数.不能开机自动完全从0开始启动,需要uboot帮助内核实现重定位并提供参数. 首先,uboo会从Kernel分区中读取bootcmd环境变量,根据环境变量可自动启动. 分区 ...

  4. java 26 - 9 网络编程之 TCP协议多用户上传文件

    TCP实现多用户上传文件: 需要同时给多用户上传文件,这样就得用多线程来实现. 实际上,这样的话,上传的先后顺序和速度就跟客户端的带宽有关:带宽够,就容易抢占到线程的执行权: 首先,创建个线程类:(这 ...

  5. PAT 1026. 程序运行时间(15)

    要获得一个C语言程序的运行时间,常用的方法是调用头文件time.h,其中提供了clock()函数,可以捕捉从程序开始运行到clock()被调用时所耗费的时间.这个时间单位是clock tick,即&q ...

  6. AAL template: ROI to brain lobe

    Reference: Altmann A, Schröter M S, Spoormaker V I, et al. Validation of non-REM sleep stage decodin ...

  7. QQ浏览器X5内核问题汇总

    原文:http://itindex.net/detail/53391-qq-浏览器-x5 常常被人问及微信中使用的X5内核的问题,其实我也不是很清楚,只知道它是基于android 4.2的webkit ...

  8. Swagger 增加 DocumentFilter 隐藏不需要显示的接口

    services.ConfigureSwaggerGen(options => { options.SingleApiVersion(new Info { Version = "v1& ...

  9. JAVA CDI 学习(5) - 如何向RESTFul Service中注入EJB实例

    RESTFul Service中如果要注入EJB实例,常规的@Inject将不起作用,在Jboss中,应用甚至都启动不起来(因为@Inject注入失败),解决方法很简单:将@Inject换成@EJB ...

  10. WebPack系列:Webpack编译的代码如何在tomcat中使用时静态资源路径不对的问题如何解决

    问题:     使用webpack+vue做前端,使用tomcat提供api,然后npm run build之后需要将编译,生成如下文件: |   index.html \---appserver   ...