Chrome中输入框默认样式移除
Chrome中输入框默认样式移除
在chrome浏览器中会默认给页面上的输入框如input、textarea等渲染浏览器自带的边框效果
IE8中效果如下:
Chrome中效果如下:

这在我们未给输入框设置获取焦点时改变边框颜色时,chrome浏览器解析页面中默认将输入框获取焦点时改变边框效果,这给我们带来了极大的方便。如果我们要自己设置边框色时,chrome浏览器的默认操作就给我们的设置(boder:1px solid color)带来了问题,这是你会发现,你的设置在其他浏览器中时有效的,但在chrome中却是无效的。
为解决这问题我们只需加上如下css,便可解决问题:
*:focus { outline: none; }
若想给某个输入框增加样式,也可这样操作:
#inputBT:focus { outline: 1px solid #ed6f19; }
效果入下:

这样设置时会发现,在橘色边框旁还有一个细细的边框色,将css样式改为,即可完美解决:
#inputBT:focus { border: 1px solid #ed6f19; }
Chrome中输入框默认样式移除的更多相关文章
- css样式之input输入框默认样式
帮朋友写个简单的课程设计,后面会贴出来,项目刚开始就遇到一个坑(给input输入框设定样式,但是,点击后会出现蓝色边框),之前写其他的项目时也遇到过,百度一下资料解决了,现在又碰到了,写一下,留着备用 ...
- chrome的input默认样式黄色背景以及选中加粗的边框处理
问题描述: chrome输入用户名和密码,然后浏览器自己有记忆功能,等再次登录的时候,他会显示chrome默认的黄色背景色,还有选中时周围会有很粗的边框 解决方案: 去掉黄色背景,给input添加au ...
- 解决chrome记住账号默认样式覆盖
当谷歌游览器记住账号后,输入框的颜色会变为黄色,最直接的方法:加入以下代码 input:-webkit-autofill , textarea:-webkit-autofill, select:-we ...
- 去除html页面中按钮在ios中的默认样式,去除select自带的小三角图标
btn{-webkit-appearance: none;} -webkit-appearance: none也能去掉select下拉列表后面自带的小三角
- input type="file"在各个浏览器下的默认样式,以及修改自定义样式
一.<input type="file"/>在各个浏览器中的默认样式: 系统 浏览器 样式效果 点击效果 mac google 点击按钮和输入框都可以打开文件夹 mac ...
- Android使用默认样式创建View的几个姿势
以下内容是分析安卓源码所得: 1: 使用默认样式创建View的方式, 源码文件 Button.Java 注:此文参考http://www.linzenews.com/ 中的内容所写,如侵删! 2: ...
- Sass 默认样式库
Sass 默认初始化样式库 @charset "utf-8"; // 变量存储 // 字体Unicode编码 微软雅黑:\5FAE\8F6F\96C5\9ED1 , 宋体:\5B8 ...
- 取消chrome浏览器下input和textarea的默认样式;html5默认input内容清除“×”按钮去除办法
取消chrome浏览器下input和textarea的默认样式: outline:none;/*清空chrome中input的外边框*/ html5默认input内容清除“×”按钮去除办法: inpu ...
- 取消chrome浏览器下input和textarea的默认样式
最近一个细节引起了我的注意,chrome浏览器下的input和textarea在聚焦的时候都有一个黄色的边框,而且textarea还可以任意拖动放大,这是不能容忍的,影响美观不说,有时候拖动texta ...
随机推荐
- Android(java)学习笔记140:常用的对话框
一.常见对话框属性: 1. AlertDialog.Builder属性 • setTitle: 为对话框设置标题 :• setIcon : 为对话框设置图标:• setMessage: 为对话框设置 ...
- 自己开发一个APP需要多少钱
广州APP开发公司[启汇网络]经常遇到有开发定制APP软件需求的企业,通常第一句问的就是“开发一款APP需要多少钱”,在做完客户行业的市场调查后,再了解客... 广州APP开发公司[启汇网络]经常遇到 ...
- |chromosomal walk |zoo blot|鉴定疾病gene|
5.6基于外显子的保守性鉴定真核生物编码蛋白质的基因 鉴定功能性基因的流程是:1.连锁分析找到该基因的染色体的特定区域:2.在这段序列中选择一条短序列,寻找满足两个条件的基因(条件一:因为功能性基因是 ...
- shell脚本,按行读取文件的几种方法。
第一种方法用while实现按读取文件.[root@localhost wyb]# cat a.txt 第一行 aaaaaa 第二行 bbbbbb 第三行 cccccc 第四行 dddddd 第五行 e ...
- java在线聊天项目 swt可视化窗口Design 重新设计聊天窗口
设计的聊天窗口如下: 制作过程: 首先,在默认的BorderLayout视图下, 上边也就是North处添加一个JPanel,将Layout调整为BorderLayout,West放一个JLabel用 ...
- 哪些 Python 库让你相见恨晚?
知乎用户,A European Swallow. 苇叶.Aran He.jerry等人赞同 补充三个有助于自动化日常工作的: sh:sh 1.08 — sh v1.08 documentation可以 ...
- linux中进程亲和性绑定
什么是绑核所谓绑核,其实就是设定某个进程/线程与某个CPU核的亲和力(affinity).设定以后,Linux调度器就会让这个进程/线程只在所绑定的核上面去运行.但并不是说该进程/线程就独占这个CPU ...
- Web安全XSS、CSRF和SQL注入
SQL注入 SQL注入是以用户的输入作为sql语句的一部分,如后端接收到用户的请求数据后,不经过数据转义,就把数据拼接到SQL中执行,容易导致SQL的语义被篡改,即受到攻击了. 解决办法是对接收的数据 ...
- 守护进程,互斥锁,IPC,生产者与消费者模型
守护进程: b 进程守护 a进程,当a进程执行完毕时,b进程会跟着立马结束 守护进程用途: 如果父进程结束了,子进程无需运行了,就可以将子进程设置为父进程的守护进程 例如我们qq视频聊天时,当我们退出 ...
- (转)automaticallyAdjustsScrollViewInsets(个人认为iOS7中略坑爹的属性)
转自http://m.blog.csdn.net/blog/humingtao2013/27662093 automaticallyAdjustsScrollViewInsets(个人认为iOS7中略 ...