HTML表单元素包括样式元素及其补救方法
对风格元素的形式因素叠加的问题通常是HTML页面的设计过程中，首先是一个典型的例子。不要小看这看似低级的问题，即使一些大的网站也有类似的问题。本文讨论了这一问题的根本原因，并提出了补救，补救而不是一劳永逸的，由于两巨头微软和网景还没有对策。首先，html元素的显示优先级
常用的表单元素在HTML中包括：文本区域（区域），列表框（选择），一个文本输入框（输入框的文本），密码输入框（输入类型=密码），收音机的输入框（输入类型电台），检查输入框（输入类型复选框），等。常见的非形式要素包括链接标记（一）、div标记，跨度标记，表格标签，等等。对表单元素叠加样式元素的基本原因是HTML元素的默认显示优先级规则。例如，框架元素总是先于其他HTML元素，所以它们总是显示在最前面；表单元素总是先于所有非表单元素。
所有这些HTML元素可分为根据他们的显示要求，即分为两类，与Windows中的HTML元素（窗口单元）和无窗的HTML元素（无窗的元素），有Windows的元素包括选择元，物元，插件，IE 5.01和iframe元素早期的版本。窗户的要素包括：最普通的HTML元素，如链接和表格标签，除了大部分的表单元素除了选择元素，NS6 + / IE 5.5和以后版本中的iframe元素。本文讨论的问题主要涉及到窗口的HTML元素。问题的症结是，操作系统总是显示窗口元素在窗户前默认元素。
浏览器类型和显示优先级
根据浏览器类型比较，HTML元素的显示顺序也不同，概述如下：
1 Netscape / Mozilla
在NS浏览器6以前的版本中，表单元素总是比其他HTML元素有更高的优先权。但在NS 6 +浏览器，iframe元素和所有的表单元素的CSS z-index属性值确定的显示顺序，或是由他们出现在HTML页面的顺序确定，除选择元素。
Internet Explorer
在最新的IE浏览器（6），iframe和所有形式要素确定基于z-index属性值或他们出现在HTML页面的显示优先级顺序，除了选择元素。
歌剧
在最新的Opera浏览器（7.10），所有的表单元素，包括选择，根据z-index属性或它们的发生顺序在HTML页面的显示优先级确定。然而，最新的Opera浏览器不显示iframe作为无窗口元素。iframe作为窗口元素，它优先于所有的窗口元素的显示顺序。
在三和CSS属性
我们知道CSS z-index属性可以用来控制任何HTML元素显示叠加顺序。当多个HTML元素重叠在同一空间，对z-index值越大的元素将覆盖z-index值较小的元素。
但是z-index属性值不是万能的，正如前面提到的，与Windows的元素总是显示在窗口前自由的元素，和z-index属性值只起到决定性的作用，同样的要素类之间。打个比方，窗口元素和无窗的元素像是两个不同的帆布画在同一个浏览器窗口，两种元素是自组织的，其z-index属性只是相对其他元素在同一画面。
四，补救办法
当前的浏览器，一个更有效的补救办法是：当窗口元素需要覆盖的窗口元素，使用脚本动态隐藏窗口元素。以下是一个完整的例子：
。menublock {位置：相对；顶部：14px；宽度：165px；边界：2px黑色固体；}
#子{位置：相对；左：15px；顶部：15px；宽度：171px；
填充左：2px；填充右：2px；边界：2px黑色固体；
Z指数：100；能见度：隐藏；}
# lb_1 {位置：绝对；左：10px；顶部：40px；}
VaR是主动=假；
功能菜单（）{
活跃=真；
/ / document.getelementbyid（lb_1）。风格。能见度=隐藏；
document.getelementbyid（菜单）。风格。能见度=可见；
}
功能hidemenu（）{
活跃=假；
（'hide setTimeout（）'，100）；
}
函数隐藏（）{
如果（！IsActive) {
document.getelementbyid（菜单）。style.visibility =隐藏；
document.getelementbyid（lb_1）。风格。能见度=可见；
}
}
功能setStyle（MenuItem）{
活跃=真；
menuitem.style.backgroundcolor =灰色；
menuitem.style.color =# ffffff
}
功能setdefault（MenuItem）{
活跃=假；
menuitem.style.backgroundcolor = ；
menuitem.style.color =
HideMenu（）；
}
选择列表
U3000
页面的部分定义了三种样式，分别用于菜单栏、菜单项和选择列表。它确保菜单通过风格的定义和选择列表中的重叠区域，部分包含了菜单和选择列表的定义。当鼠标经过菜单栏，菜单执行的Javaｓｃｒｉｐｔ函数，显示菜单和隐藏的选择列表，鼠标离开后，该hidemnu功能隐藏菜单和恢复选择列表中的Javaｓｃｒｉｐｔ函数的其余部分主要是用于模拟菜单操作。当鼠标经过菜单项，它将显示菜单的高亮度（setStyle功能）。当鼠标离开菜单项，它会恢复默认的显示形式（setdefault功能）。页面的效果图2所示。你可以通过对document.getelementbyid看到图1的效果（lb_1）。风格。能见度=隐藏在菜单功能声明。
总之，表单元素的叠加样式元素的根源是HTML元素的默认显示优先级规则。本文介绍的方法真的有效，但是如果你真的不想用这种方法，你必须考虑改变页面布局，以避免重叠显示区域的内容和形式风格元素。