Vil*_*iam 50 html css internet-explorer inputbox internet-explorer-8
我在表单中有一个绝对定位的输入框.输入框具有透明背景:
.form-page input[type="text"] {
border: none;
background-color: transparent;
/* Other stuff: font-weight, font-size */
}
令人惊讶的是,我无法通过在IE8中单击它来选择此输入框.但它在Firefox中完美运行.同样的事情发生了background: none.当我更改背景颜色时:
background-color: red;
它工作正常,所以这是与透明背景相关的问题.设置边框只需单击其边框即可选择输入框.
是否有一个解决方法是在IE8中使用透明背景的可点击输入框？
更新:示例.取消注释background-color,输入框可选.您也可以单击选择框,然后按Shift + Tab键对输入框进行聚焦.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html><head></head><body>
<style type="text/css">
input[type="text"] {
border: none;
background: transparent;
/*background-color: blue;*/
}
#elem528 { position:absolute; left:155px; top:164px; width:60px; height:20px; }
#elem529 { position:absolute; left:218px; top:164px; width:40px; height:20px; }
</style>
<img src="xxx.png" alt="" width="1000" height="1000">
<input id="elem528" maxlength="7" type="text">
<select id="elem529"></select>
</body></html>
bob*_*nce 27
我无法在IE8中重现这样的问题.完整的测试案例？您确定没有分层问题导致其他透明元素覆盖可点击区域吗？
设置background-image有所作为吗？透明GIF怎么样？
ETA:好奇!它实际上是一个IE7错误.对我来说,你的例子展示了IE7中描述的行为,但在IE8中,它只在EmulateIE7模式下出现; 在IE8本机渲染中它是固定的.您通常希望通过使用合适的X-UA-Compatible标头/元来确保不会回退到IE7渲染; 但是,是的,设置background-image透明GIF为我解决了问题.Tsk,即使在这个时代,我们仍然需要空白的GIF,是吧？
请包含输入元素的html.
你是如何定义输入元素的？以下代码适用于IE8(IE 8.0.7600 Windows).我在IE8中试过这个并且能够"选择"输入区域就好了.
<html>
<head>
<style>
.form-page input[type="text"] {
border: none;
background-color: transparent;
/* Other stuff: font-weight, font-size */
}
</style>
</head>
<body>
<input type="text" name="test" value="test" id="test"/>
</body>
</html>
小智 6
只需给输入字段一个透明的背景图像,它就会起作用......
例:
#search .input {
width:260px;
padding:3px 5px;
border:0;
background:url(../images/trans.gif);}
| 归档时间： |
|
| 查看次数： |
89406 次 |
| 最近记录： |