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中输入框默认样式移除的更多相关文章

  1. css样式之input输入框默认样式

    帮朋友写个简单的课程设计,后面会贴出来,项目刚开始就遇到一个坑(给input输入框设定样式,但是,点击后会出现蓝色边框),之前写其他的项目时也遇到过,百度一下资料解决了,现在又碰到了,写一下,留着备用 ...

  2. chrome的input默认样式黄色背景以及选中加粗的边框处理

    问题描述: chrome输入用户名和密码,然后浏览器自己有记忆功能,等再次登录的时候,他会显示chrome默认的黄色背景色,还有选中时周围会有很粗的边框 解决方案: 去掉黄色背景,给input添加au ...

  3. 解决chrome记住账号默认样式覆盖

    当谷歌游览器记住账号后,输入框的颜色会变为黄色,最直接的方法:加入以下代码 input:-webkit-autofill , textarea:-webkit-autofill, select:-we ...

  4. 去除html页面中按钮在ios中的默认样式,去除select自带的小三角图标

    btn{-webkit-appearance: none;} -webkit-appearance: none也能去掉select下拉列表后面自带的小三角

  5. input type="file"在各个浏览器下的默认样式,以及修改自定义样式

    一.<input type="file"/>在各个浏览器中的默认样式: 系统 浏览器 样式效果 点击效果 mac google 点击按钮和输入框都可以打开文件夹 mac ...

  6. Android使用默认样式创建View的几个姿势

    以下内容是分析安卓源码所得: 1: 使用默认样式创建View的方式, 源码文件 Button.Java  注:此文参考http://www.linzenews.com/ 中的内容所写,如侵删! 2: ...

  7. Sass 默认样式库

    Sass 默认初始化样式库 @charset "utf-8"; // 变量存储 // 字体Unicode编码 微软雅黑:\5FAE\8F6F\96C5\9ED1 , 宋体:\5B8 ...

  8. 取消chrome浏览器下input和textarea的默认样式;html5默认input内容清除“×”按钮去除办法

    取消chrome浏览器下input和textarea的默认样式: outline:none;/*清空chrome中input的外边框*/ html5默认input内容清除“×”按钮去除办法: inpu ...

  9. 取消chrome浏览器下input和textarea的默认样式

    最近一个细节引起了我的注意,chrome浏览器下的input和textarea在聚焦的时候都有一个黄色的边框,而且textarea还可以任意拖动放大,这是不能容忍的,影响美观不说,有时候拖动texta ...

随机推荐

  1. Codeforces Round #290 (Div. 2) _B找矩形环的三种写法

    http://codeforces.com/contest/510/status/B 题目大意 给一个n*m  找有没有相同字母连起来的矩形串 第一种并查集 瞎搞一下 第一次的时候把val开成字符串了 ...

  2. 复合词UVa10391(STL简单应用)

    一.题目 输入一系列由小写字母组成的单词.输入已按照字典序排序(这句话就是个陷阱),且不超过120000个.找出所有的复合词,即恰好由两个单词连接而成的单词. 二.解题思路 要么枚举两两拼接的情况,O ...

  3. ios之自定义UISwitch

    系统自带的UISwitch是这样的: 既不能写字,也不能改颜色,于是在网上找到了这么一个自定义的Switch按钮,具体出处找不见了.记录一下,怕以后找不见了. 先看下效果图: 按钮的样式很多,可以文字 ...

  4. UVA-1220-Party at Hali-Bula && UVA-1218-Perfect Service(树形DP)

    UVA-1220-Party at Hali-Bula 题意: 一个公司员工要举行聚会,要求任意一个人不能和他的直接上司同时到场,一个员工只有一个支系上司,现在求最多有多少人到场,并且方案是否唯一(紫 ...

  5. bzoj5183 [Baltic2016]Park

    题目描述: bz luogu 题解: 把坐标系看反了持续$WA$系列. 对偶图+并查集维护. 先处理出树对树.树对墙的空隙,然后把人和空隙按从小到大排序. 用并查集维护四面墙之间是否能互相隔断. 代码 ...

  6. 牛客网NOIP赛前集训营-普及组(第二场)和 牛客网NOIP赛前集训营-提高组(第二场)解题报告

    目录 牛客网NOIP赛前集训营-普及组(第二场) A 你好诶加币 B 最后一次 C 选择颜色 D 合法括号序列 牛客网NOIP赛前集训营-提高组(第二场) A 方差 B 分糖果 C 集合划分 牛客网N ...

  7. MySql的基操勿六

    2018/12/6 星期四 19:34:07 authot by dabaine 数据库注释; -- 这就是注释 /*.....*/ 这也是注释 创建库; create databse [if not ...

  8. MySQL中数组的存储

    1. MySQL中以字符串的形式存储数组 MySQL中无数组类型,通常将数组元素按某个字符分割以字符串形式存储 1.1. 求数组中元素的个数 方法:按指定符号分割字符串,返回分割后的元素个数.方法很简 ...

  9. TUN/TAP/VETH

    TUN/TAP虚拟网络设备为用户空间程序提供了网络数据包的发送和接收能力.他既可以当做点对点设备(TUN),也可以当做以太网设备(TAP). TUN/TAP虚拟网络设备的原理: 在Linux内核中添加 ...

  10. 蓝牙学习(5) -- sockets

    Frames 由下图可以看出 - SDU由多个I-frames中的Information Payload组成 - 一个I-frames又拆分成多个HCI data payload socket buf ...