爲什麼下面的代碼將提交按鈕放在FF中的自己的行上,但在IE中的同一行上?提交按鈕和顯示塊在IE
<style type="text/css">
#div1 form input.submit {display:block;}
</style>
<div id="div1">
<form>
hi
<input type="submit" class="submit" value="hello there">
</form>
</div>
爲什麼下面的代碼將提交按鈕放在FF中的自己的行上,但在IE中的同一行上?提交按鈕和顯示塊在IE
<style type="text/css">
#div1 form input.submit {display:block;}
</style>
<div id="div1">
<form>
hi
<input type="submit" class="submit" value="hello there">
</form>
</div>
如果您正在測試的IE6嘗試:
#div1 form .submit {display:block;}
因爲IE不符合Web標準。
在我看來好像form
選擇器的方式獲得,至少與tripply嵌套的選擇:
這工作:
#div1 input.submit{
display:block;
}
這工作:
form input.submit{
display:block;
}
這不是:
#div1 form input.submit{
display:block;
}
發生這種情況的原因是因爲您缺少<body>
開放標記。如果<body>
打開的標記未顯式顯示在HTML中,則IE(至少6)不會顯示文檔樹,並且涉及form
元素的任何選擇器都無法正常工作。
Here,我添加了body標籤,它的工作原理。
只是yesterday I documented pretty much the same bug。它看起來像我不得不更新描述來說明不僅身體標記遺失的形式不可變,而且其他元素如果在選擇器中是不可變的。
正如doctororange所指出的,您可以通過在選擇器中不指定form
來解決此問題,但我建議您使用<body>
標記。
我剛剛在IE8中測試了這個按鈕,並且它自己的行。你使用的是什麼版本的IE? – Martha 2010-09-30 16:24:17