input 去掉点击后出现的边框

添加属性 :focus{outline:none} 就可以去掉默认点击时,边框会出现的蓝色边框。
:focus 选择器用于选取获得焦点的元素。
提示:接收键盘事件或其他用户输入的元素都允许 :focus 选择器。
不想点击时每次都要设置的话,最好在默认样式中就设置:
input,textarea,select,a:focus {
outline: none;
}
用 :focus 实现外部边框改变颜色:

input:focus {
outline:1px solid #7c448f;
}
用 :focus 实现内部边框改变颜色:

input:focus{
border-color:#7c448f ;
outline: none;
}
---------------------------------------------------------分割线-------------------------------------------------
- outline(轮廓)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用。(outline是围绕元素。它是围绕元素的边距。但是,它是来自不同的边框属性,outline不是元素尺寸的一部分,因此 元素的宽度和高度属性不包含轮廓的宽度 )
- outline简写属性在一个声明中设置所有的轮廓属性。
- 可以设置的属性分别是(按顺序):outline-color(规定边框的颜色), outline-style(规定边框的样式), outline-width(规定边框的宽度)。
- 如果不设置其中的某个值,也不会出问题,比如 outline:solid #ff0000; 也是允许的。

input 去掉点击后出现的边框的更多相关文章
- css总结4:input 去掉外边框,placeholder的字体颜色、字号
1 input 标签去除外边框: 在进行webAPP开发时,input外边框非常影响美观,去除外边框方法如下: <input style="border: 0px;outline:no ...
- 鼠标点击 input,显示瞬间的边框颜色,对之修改与隐藏
示例的是项目中的遇到的,要做成的效果是点击该图片按钮,达到切换图片的效果: HTML代码如下: <input class="dBox3Ulimg" type="im ...
- css实现input文本框的双边框美化
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- 【Winfrom-Button】 重写Button,去掉获取焦点时的边框
Winfrom Button 去掉获取焦点时的边框: 自定义一个Button,重写ShowFocusCues方法 /// <summary> /// 去掉获取焦点的边框 /// </ ...
- input点击后的 默认边框去除
转自 http://blog.sina.com.cn/s/blog_9f1cb4670102v47g.html css文件里加句话:*:focus { outline: none; } 或 input ...
- 去掉input获取focus时的边框
贴图,问题如下: 尽管已经设置输入框的border为none,当输入框focus时扔会出现浏览器自带的边框 解决方法,添加如下样式即可,.fs_input为输入框样式 ---------------- ...
- 去掉a标签点击后的虚边框
a { cursor: pointer; text-decoration: none; hide-focus: expression(this.hideFocus=true); outline: no ...
- HTML页面表单输入框去掉鼠标选中后边框变色的效果
标题说的有些含糊,实在不知道怎么描述了,就简单说一下吧,一个最简单的表单,代码如下,没有任何样式和名字, <!DOCTYPE html> <html> <head> ...
- (谷歌浏览器等)解决css中点击input输入框时出现外边框方法【outline:medium;】
问题:在使用谷歌浏览器,360浏览器时,点击input输入框会出现带颜色的外边框,如下图所示:
随机推荐
- Google官方网络框架Volley实战——QQ吉凶测试,南无阿弥陀佛!
Google官方网络框架Volley实战--QQ吉凶测试,南无阿弥陀佛! 这次我们用第三方的接口来做一个QQ吉凶的测试项目,代码依然是比较的简单 无图无真相 直接撸代码了,详细解释都已经写在注释里了 ...
- Unity Web自适应浏览器
unity web的自适应浏览器比我想象中要更简单,但是这里也只有更改最简单的东西实现了自适应.发布web时,在playersetting里面设置分辨率为你在Game窗口自定义的分辨率大小,以保证内容 ...
- How I Turned Down $300,000 from Microsoft to go Full-Time on GitHub
How I Turned Down $300,000 from Microsoft to go Full-Time on GitHub (我是如何拒绝微软30w的诱惑,专注于GitHub事业) 当我老 ...
- Xcode使用心得02:如何在项目中关闭ARC特性
在obj-c系列内存管理的博文里大家应该对ARC有所了解,一般是不推荐关闭ARC特性的,但你也保不齐啥时候有这个需求,于是乎我们看看在最新的x6b中如何将其关闭吧. 因为Build Seting里的子 ...
- 四、删除 Delete
文档目录 开始使用 初始化查询实例: LambdaToSql.SqlClient DB = new LambdaToSql.SqlClient(); 删除单个实体,通过Guid主键删除 var gu ...
- GitHub Desktop 如何创建本地仓库,上传代码,删除仓库
1.创建本地仓库 2.打开本地仓库,将要上传的文件放到本地仓库. 3.ctrl+p push仓库或者菜单栏Repository下push也可以用右上角的publish respository 4.左边 ...
- 使用javascript中读取Xml文件做成的一个二级联动菜单
[html] view plaincopy <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> ...
- pslq常用操作
1,登录后默认自动选中My Objects 默认情况下,PLSQL Developer登录后,Brower里会选择All objects,如果你登录的用户是dba,要展开tables目录,正常情况都 ...
- 纯CSS炫酷的3D旋转
<html><head><meta charset="utf-8"><title>纯CSS炫酷的3D旋转</title> ...
- 二叉树,AVL树和红黑树
为了接下来能更好的学习TreeMap和TreeSet,讲解一下二叉树,AVL树和红黑树. 1. 二叉查找树 2. AVL树 2.1. 树旋转 2.1.1. 左旋和右旋 2.1.2. 左左,右右,左右, ...