0

私はhtml 5を使用しています。フォームに入力フィールドがあり、次のコードがあります

<input name="address" id="address" type="text" onFocus="if(this.value =='Address' ) this.value=''" onBlur="if(this.value=='') this.value='Address'" value="Address">

入力欄のcssは

input#address{ width:411px; border:0px; height:50px; line-height:50px; padding-left:15px;}

問題は幅です。テキスト フィールドの幅が Firefox や 7 とは異なります。これを修正するにはどうすればよいですか?

4

4 に答える 4

1

ブラウザには独自のデフォルト スタイルがあります。ページをどのブラウザでも同じように表示したい場合は、css リセットを使用してから、手動で要素のスタイルを設定します。

于 2012-07-13T04:14:37.593 に答える
0

入力要素のパディングとマージンをリセットしてみてください

input {
    margin:0;
    padding:0;
}
于 2012-07-13T04:11:46.847 に答える
0

要件が変わるため、パディングやボーダーを削除することはお勧めしません。

その理由は、ブラウザによってボックスモーダルが異なるためです

ページに doctype を追加すると問題が解決する場合もありますが、常にそうとは限りません。

次のコードを使用して、すべての主要なブラウザーでボックスが同じように表示されるようにすることができます。

input#address{
  width:411px;
  border:0px;
  height:50px;
  line-height:50px;
  padding-left:15px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}
于 2012-07-13T04:12:42.297 に答える
0

こんにちは、このようにプロパティを表示するために使用されます

input#address{
display:block;
}
于 2012-07-13T04:07:22.010 に答える