IE6 および 7 の input_html/css_WEB-ITnose-htmlチュートリアル-php.cn

input ie html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style type="text/css">*{margin:0px; padding:0px}table{ border-collapse:collapse; border-spacing:0}</style></head><body>	<table>		<tr>			<td>				<input type="text" style="width:100px; height:50px; background:red; border:2px solid black" />			</td>		</tr>		<tr>			<td>				<input type="text" style="width:100px; height:50px; background:yellow; border:2px solid black" />			</td>		</tr>		<tr>			<td>				<div style="background:#138eee; width:100px; height:50px; border:2px solid black"></div>			</td>		</tr>	</table></body></html>

ログイン後にコピー

1. -> 入力の上下にもう 1 つのピクセルがあることがわかります
2. この問題を解決するには -> float:left を使用します
3. 他に方法はありますか?

ディスカッションへの返信（解決策）

これは td のスペースが原因のようです。試してみてください。それを次のように変更します

<td><input type="text" style="width:100px; height:50px; background:red; border:2px solid black" /></td>

ログイン後にコピー

スペースはもともとそこにありましたうまくいかない場合は...解決を続けてください...

なぜテーブルを使用するのですか？ divは使えないのでしょうか？

多くの方法を試しましたが、どれもうまくいきませんでした。float を使用して、

を追加することしかできないようです。試してみた後、投稿者は失敗しました。上記の状況では、2 つの入力間の境界が太字で表示されます。

border-spacing 属性は、border-collapse 属性値が sepeate に設定されている場合にのみ有効です。

Table header

試してみたところ、元の投稿者が指摘した状況は発生しませんでした。2 つの入力間の境界線は太字で表示されました。それだけです。

投稿者は、この問題は IE6/IE7 で発生すると述べています。試してみましたが、本当にその通りでした！

input を div に置き換えるとギャップはなくなります
したがって、IE6/IE7 のテーブルの input 要素に問題がある可能性があります
テスト後、次のコードでこのギャップの問題を解決できます。
リーリー