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 ...
随机推荐
- C#中Json进行序列化时去掉值为null的节点
当我们用json文件为数据源时,并对json数据进行操作时可能会产生一些数值为null的节点生成,想要去掉null的节点需要一些操作 本文用一个简单的工具对json进行操作 工具:Newtonsoft ...
- java程序-类的高级特性
创建Employee类,在类中定义三个属性:编号,姓名,年龄,然后在构造方法里初始化这三个属性,最后在实现接口中的定义的CompareTo方法,将对象按编号升序排列. 代码如下:(程序可能有些错误,方 ...
- BOM函数之history对象
前面的话 history对象保存着用户上网的历史记录,从窗口被打开的那一刻算起.由于安全方面的考虑,开发人员无法得到用户浏览器的URL,但借由用户访问过的页面列表,可以在不知道实际URL的情况下实现后 ...
- 什么是二维数组?二维遍历?Java二维数组制作图片迷宫 使用如鹏游戏引擎制作窗口界面 附带压缩包下载,解压后双击start.bat启动
什么是二维数组? 数组当中放的还是数组 int [][] arr=new int[3][2]; 有3个小箱子,每个箱子2个格子. 看结果? int [][] arr=new int[3][2]; Sy ...
- React中 checkbox 与 label 标签的搭配
用<label>标签替代checkbox的点击样子,点击<label>实际上就是点击checkbox checkbox的checked值会跟着一起变 <input typ ...
- (51)zabbix命令:zabbix_get获取item数据
zabbix_get是什么?有什么作用? 总有人在群里提问,为什么zabbix获取不到数据,为什么zabbix提示Not Support,怎么办?别老问,用zabbix_get试着获取数据即可.在za ...
- mysql 审核引擎 goInception 的基本使用
官网地址 github.com 安装 git clone https://github.com/hanchuanchuan/goInception.git cd goInception 修改配置 开启 ...
- Python9-递归函数-day17
# 计算方法:人脑复杂,计算机简单#查找:找数据#排序#最短路径#我们学习的算法都是过去时#要了解基础的算法,才能创造出更好的算法#不是所有的事情都能套用现成的方法解决的# 有些时候会用到学过的算法只 ...
- 基于IAR移植sdk12.2.0建立nrf52832的工程———GPIO
工程伊始,需要在sdk包中拷贝三个重要的文件,blinky_iar_nRF5x.icf,iar_startup_nrf52.s,system_nrf52.c. 工程目录建立: 1.建立bsp文件,包括 ...
- Java集合之PriorityQueue
PriorityQueue 定义 C++:priority_queue Java:PriorityQueue 创建与其基本操作 创建: PriorityQueue<Integer>=new ...