html中div获取焦点,去掉input div等获取焦点时候的边框
经测试只有在IE chrome才会在获取焦点时有边框
使用CSS
div{
outline:none;
}
DIV焦点事件详解 --【focus和tabIndex】
摘自:http://my.oschina.net/jgy/blog/131970
添加 tabindex='-1' 属性;
默认:获取不到焦点事件(blur)
<div class="wl-product" id="wl-product"></div>
可以获取焦点事件(blur)
<div class="wl-product" id="wl-product" tabindex='-1'></div>
首先看看w3c关于onfocus的部分:
The onfocus event occurs when an element receives focus either by the pointing device or by tabbing navigation.
This attribute may be used with the following elements: A, AREA, LABEL, INPUT, SELECT, TEXTAREA, and BUTTON.
当元素通过指定(点击)或tab导航(Tabbing navigation)获得焦点,onfocus事件就会触发。
该属性会使用在以下元素(就是说默认可以获取焦点的元素):A, AREA, LABEL, INPUT, SELECT, TEXTAREA, and BUTTON.
div, frameSet, span, table, td.只有设置tableindex才能获取焦点,但
IE默认能获取焦点但不能tab导航
不同tabIndex值在tab order(Tabbing navigation)中的情况:
Objects with a positive tabIndex are selected in increasing iIndex order and in source order to resolve duplicates.
Objects with an tabIndex of zero are selected in source order.
Objects with a negative tabIndex are omitted from the tabbing order.
tabIndex值是正数的对象根据递增的值顺序和代码中的位置顺序来被选择
tabIndex值是0的对象根据在代码中的位置顺序被选择
tabIndex值是负数的对象会被忽略
html中div获取焦点,去掉input div等获取焦点时候的边框的更多相关文章
- input+div 下拉选择框
前台html页面 <html> <head> <meta name="viewport" content="width=device-wid ...
- css pre如果同时运用了css的border-radius、 overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡
pre如果同时运用了css的border-radius. overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡. 解决方法:去掉css中border-radius. ...
- 在div中设置文字与内部div垂直居中
要实现如图一所示的结果: html代码如下: <!DOCTYPE html> <html> <head lang="zh"> <meta ...
- 一个div在另一个div中水平垂直的方法
html <div id="main"> <div id="box"> 一个div在另一个div中垂直居中实现方法 </div&g ...
- html5中如何去掉input type date默认
html5中如何去掉input type date默认样式 2.对日期时间控件的样式进行修改目前WebKit下有如下9个伪元素可以改变日期控件的UI:::-webkit-datetime-edit – ...
- 关于自适应屏幕,设置子元素浮动,父div不能包裹子div,子元素中内容溢出的问题。
设置HTML适应不同分辨率的屏幕. 需求结构如下: HTML结构代码如下(只是其中一条): <body> <div class="content">< ...
- div中嵌套的多个div使用了浮动后居中的办法
今天做网页的时候遇到了标题中的问题,网上查到了解决办法,记录一下一放以后忘记 <div class="wai"> <div style="float:l ...
- 解决echart在IE中使用时,在div中加入postion后图表不显示问题
<!-- 为ECharts准备一个具备大小(宽高)的Dom --> <div id="main" style="height:400px;width:1 ...
- 大div中,三个小div水平居中
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- 使用JMeter3.0实战之分布式并发测试以及web API接口测试
简介: 该文档是以Apche JMeter-3.0为例进行编写的,通过网上的学习资料和官方文档的说明手册学习后,进行项目操作实践,将测试的过程记录下提供给大家学习. 本博文的内容主要是进行配置JMet ...
- Node.js meitulu图片批量下载爬虫1.04版
//====================================================== // https://www.meitulu.com图片批量下载Node.js爬虫1. ...
- python基础语法(四)
--------------------------------------------接 Python 基础语法(三)---------------------------------------- ...
- 《Docker 入门与实践》 已经出版了~欢迎有须要的朋友关注。
在云计算时代.开发人员将应用转移到云上已经攻克了硬件管理的问题,然而软件配置和管理相关的问题依旧存在. Docker的出现正好能帮助软件开发人员开阔思路.尝试新的软件管理方法来解决问题. 通过掌握Do ...
- (三)Maven基本概念——常用插件的配置
看注释———— pom.xml <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http ...
- vb.net版机房收费——助你学会七层架构(二)反射+抽象工厂
上一篇咱们做好了准备工作.数据库设计和Entity层,如今介绍 4.反射+抽象工厂 反射:用来消除Switch和if的,这里我尽量简单地介绍,以便大家理解.反射其有用起来非常easy.你就觉得他就是决 ...
- kafka分布式搭建
kafka分布式搭建 (192.168.230.129)master (192.168.230.130)slave1 (192.168.230.131)salve2 在master.slave1.sl ...
- STM32在程序运行过程中关闭定时器重新打开后定时器不工作的问题
问题:数码管显示程序放在定时TIM2中断函数里面扫描,想要实现在关闭某一功能的时候数码管不显示. 刚开始的想法是开关关闭,关闭定时器时钟:开关打开,打开定时器时钟:(但实验证明再次打开开关时定时器2却 ...
- VS2015 解决方案 或者项目 卡 正在加载 的解决办法
导致项目无法打开以及VS无法关闭. 解决方法: 1.关闭VS: 2.去C:\Users\<your users name>\AppData\Local\Microsoft\VisualSt ...
- 关于http和rpc的区别(segmentfault上的回答)
问题最近用了谷歌的grpc,所以对rpc和http有一点疑惑,感觉这两个东西功能上是一样的,rpc某个服务监听某一个方法,客户端调用这个方法,返回相应的数据,和http监听某个方法的路由 返回相应的数 ...