这里用z-indexing在IE8输入中发生了什么？

我想在HTML中将2个输入层叠在一起。在大多数浏览器（Safari，FF，IE7）中，我使用以下代码执行此操作，并且它可以正常工作，以便将第二个输入放在第一个上面，使用较亮的文本颜色，并且当您单击焦点时它。然而，在IE8中，第一个看起来已经超过第二个，所以当你点击它并开始输入时，你会看到更浅的彩色文本。这里用z-indexing在IE8输入中发生了什么？

<!DOCTYPE html> 

<html> 
    <head> 
     <title>test</title> 
     <style type="text/css" media="screen"> 
      input { 
       background-color: transparent; 
      } 
     </style> 
    </head> 
    <body> 
     <input style="position:absolute;z-index: 1;color: #dedede;"> 
     <input type="text" style="position:relative;z-index: 3;"> 
    </body> 
</html>

来源

2011-01-06 Greg Hinch

你为什么这样做？ – 2011-01-06 01:57:45

这是一个非常复杂的用户界面，与问题无关，因此我将其简化为特定问题。 – 2011-01-06 02:19:27

这个问题似乎很相似that one，所以我认为你必须一个<input>包装成一个<div>具有较高的z-index。

来源

2011-01-06 09:30:30 MatTheCat

看起来它与输入上的透明背景有关。您也可以通过向其添加透明背景图像来解决此问题。 – 2011-01-07 16:10:54

这里用z-indexing在IE8输入中发生了什么？

回答

相关问题