<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. 会话—cookie

    什么是会话?       会话可简单理解为:用户开一个浏览器,点击多个超链接,访问服务器多个web资源,然后关闭浏览器,整个过程称之为一个会话. 会话过程中要解决的一些问题?       每个用户在使 ...

  2. web安全实战

    前言 本章将主要介绍使用Node.js开发web应用可能面临的安全问题,读者通过阅读本章可以了解web安全的基本概念,并且通过各种防御措施抵御一些常规的恶意攻击,搭建一个安全的web站点. 在学习本章 ...

  3. Excel数据生成Sql语句的方法

    选中想要生成的列,套用表格格式,选中表包含标题的选项确定,然后在最右边的一列第二行处,点击函数功能,选择CONCATENATE,在文本里输入想要的结构即可  代码如下 复制代码 ,=CONCATENA ...

  4. 【Android学习之旅】1、Android入门介绍

    1.Android介绍 1.1 Android的系统架构 下面这张图展示了Android的系统架构: 图中可见,Android大致可以分为四层架构,五块区域: Linux内核层(Linux Kerne ...

  5. JS面向对象5中写法

    //定义Circle类,拥有成员变量r,常量PI和计算面积的成员函数area() //第1种写法 function Circle(r) { this.r = r; } Circle.PI = 3.14 ...

  6. NodeJS安全设计：好吃的草莓味糖果，只给好朋友小红

    上一篇文章中,我们已经建立了一个有缓冲机制的文件服务器,能给客户端响应附件类型的文件,其实,就爱莲(iLinkIT)而言,NodeJS的模块做到这样也就已经可以了,因为使用的场景就是电脑和手机之间,与 ...

  7. 定制的Server-Sent Events 聊天服务器

    //匿名聊天服务器 //将新的消息POST到/chat地址,或者以GET形式从通一个URL获取文本或事件流 //创建一个GET请求到"/"来返回一个简单的HTML文件,这个文件包括 ...

  8. GIS初学者

    学习编程一直以来没有什么好的思路,感觉就是学了忘,忘了再重复,效率特别低下.大概是从大三第一学期才有意识的转向c#的学习,来熟悉VS2010平台,在这之前我都不知道自己是怎么学习的. 大一第二学期开的 ...

  9. 关于delete

    上面三图在debug下,delete的时候会以fe ee覆盖指针所指向要回收内存前后较大一块区域的值. 下图对于release下delete的时候会先用fe ee覆盖指针所指位置起6*4=24字节, ...

  10. 51nod1256乘法逆元

    1256 乘法逆元 基准时间限制:1 秒 空间限制:131072 KB 分值: 0 难度:基础题 收藏 关注给出2个数M和N(M < N),且M与N互质,找出一个数K满足0 < K < ...