<html>

<body>

    <form>

         用户名: <input type="text" tabindex="1" />

         密码: <input type="text" tabindex="2" />

         地址: <input type="text" tabindex="3" />

         性别: <input type="text" tabindex="4" />

         年龄: <input type="text" tabindex="5" />

    </form>

    <div style="position: absolute;width:500;height:500;background-color:red; z-index:0">  <!-- 不要写成z-index=2 -->"

    第一层

    </div>

    <div style="position: absolute;width:600;height:400;background-color:green; z-index:-2">

    第二层

    </div>

    <div style="position: absolute;width:300;height:300;background-color:blue; z-index:5">

    第三层

    </div>

</body>

</html>

tabindex定义了按tab键获取光标的先后顺序~!
z-index定义了层的层次关系,在层之上还是在层之下.值大的在上面。重要说明：在某些情况下设置z-index没有效果，原因是需要设置position:absolute;为绝对定位才可以。

这种情况发生的条件有三个：（div层调整zindex属性在IE中无效原因分析及解决方法）

1、父标签 position属性为relative；

2、问题标签无position属性（不包括static）；

3、问题标签含有浮动(float)属性。

javascript div z-index, input tabindex属性说明的更多相关文章

  1. HTML TabIndex属性

    TabIndex作用: tabindex:全局属性.指示其元素是否可以聚焦(获得焦点),以及它是否/在何处参与顺序键盘导航(因通常使用tab键操作,顾因此得名). 当使用tab键在网页控件中进行导航时 ...

  2. div/span等获取焦点问题(tabindex属性的简单理解)

    1.先看问题 当我们要对一个div/span元素获取焦点的时候,直接对$("#div1").focus()是不能实现效果的,比如下图: 当点击输入框进行输入后,在点击区域弹出选择地 ...

  3. html中input标签的tabindex属性

    当浏览者浏览网站时可以通过按TAB键在网页的链接中依次移动,这是一个相当方便实用的功能.但如果网页中链接太多,恐怕按TAB键就没什么作用了,这时不妨通过改变TAB键移动的顺序来突出重点,在某些重要页面 ...

  4. JavaScript常用对象的方法和属性

    ---恢复内容开始--- 本文将简单介绍JavaScript中一些常用对象的属性和方法,以及几个有用的系统函数. 一.串方法 JavaScript有强大的串处理功能,有了这些串方法,才能编写出丰富多彩 ...

  5. 深入理解javascript函数系列第三篇——属性和方法

    × 目录 [1]属性 [2]方法 前面的话 函数是javascript中的特殊的对象,可以拥有属性和方法,就像普通的对象拥有属性和方法一样.甚至可以用Function()构造函数来创建新的函数对象.本 ...

  6. input placeholder属性IE、360浏览器兼容性问题

    效果:http://hovertree.com/texiao/jquery/43/ 效果二:http://hovertree.com/texiao/jquery/43/1/ 请在IE中体验. 1.创建 ...

  7. 改进《完美让IE兼容input placeholder属性的jquery实现》的不完美

    <完美让IE兼容input placeholder属性的jquery实现>中的代码在IE9以下浏览器中会出错,原因是因为ie9以下的浏览器对input的标签的解释不同. 例如对以下文本框的 ...

  8. tabindex属性

    1. tabindex的用法: 可以设置tab键在控件中的移动顺序. 以下元素支持tabindex属性:<a> <input> <textarea> <are ...

  9. tabindex属性用法

    支持tabindex属性的元素:<a> <input> <textarea> <area> <select> <button> ...

随机推荐

  1. Fragment 整个生命周期

      时间 2014-05-21 17:09:53 CSDN博客原文 http://blog.csdn.net/linfeng24/article/details/26491407 Fragment 生 ...

  2. swift项目－模仿团购（主界面的搭建，以及首页的一些细节）

    以前学习oc的时候写的一个团购的项目,现在学习swift,拿来用swift写一遍,也是连猜带蒙的,一点一点的往上凑. 今天主要是把主要的架子搭起来了. 主要有:UITabBarController,U ...

  3. UEditor的使用方法

    文本编辑器程序员都会用到,今天无意中发现UEditor是个好东西,特奉献给大家,并提供下载. 这个编辑器的亮点是可以显示当前输入多少字符,还可以输入多少字符. 新创建的MVC项目,在layout页面里 ...

  4. 如何找到Linux下常用命令的源码

    Linux系统,常用命令的来源很多,有些命令是shell自带的,比如cd,通过执行help命令,可以查看当前系统所有的内置命令. 用type <cmd_name>来查看一个命令是否为内置命 ...

  5. WCF 宿主与通信模式（二）

    宿主 每个WCF服务都必须托管在Windows进程中,该进程称为宿主进程(host process) 单个宿主进程可以托管多个服务,相同的服务类型也可以托管在多个宿主进程中. wcf中托管服务一般有一 ...

  6. 【转】分享10VPN

    以下介绍的vpn,都是有免费流量赠送的免费vpn,完全不免费的不在之列. 免费vpn因为用的人比较多,所以高峰时段可能会有点慢,但是人少时,还是比较顺畅的.对于偶尔浏览外网,看看新闻的同学来说,免费v ...

  7. phpcmsv9全站搜索,不限模型

    简单修改一下v9默认的搜索功能,可以不按模型搜索全站内容 下面是被修改后的search模块中的index.php文件 <?php defined('IN_PHPCMS') or exit('No ...

  8. java 中的异常处理

    一. 异常的概念和Java异常体系结构  异常是程序运行过程中出现的错误.本文主要讲授的是Java语言的异常处理.Java语言的异常处理框架,     是Java语言健壮性的一个重要体现. Java把 ...

  9. 使用JS来实现验证码功能

    最近想为自己的Django博客添加验证码功能,本来想使用第三方库来实现的,不过考虑到添加第三方库对性能的影响,以及第三方库是否安全可靠的问题,还是用自己的代码来实现吧.反正用JS来实现验证码功能又不是 ...

  10. wpf 绑定失效的原因及解决方案

    有时候,您会发现在程序开始时还能正常运行的绑定失效了.就个人经验而言,绑定的失效主要分为两种情况:对于One-way绑定而言,如果软件开发人员绕过绑定直接更改了目标属性,那么绑定将会失效.而对于Two ...