ホームページ > 記事 > ウェブフロントエンド > さまざまなブラウザの互換性の問題_html/css_WEB-ITnose
さまざまなブラウザの互換性の問題_html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-24 12:26:02836ブラウズ
一部のタグはブラウザーによって表示が異なります。
ディスカッション（解決策）への返信
たとえば、それはどのタグであり、どのブラウザでは異なりますか？
まさか、
えっと、外側の余白、内側の余白、枠線のサイズのことですか？
CSS を使用して統一するだけです。
ということですか？
そうですね、外側のマージン、内側のマージン、境界線のサイズのことですか?
CSS を使用して統一するだけです。
ということですか？
フォント表示~~~~~~~~~~~~~
同じ設定で、例えば ul 200px li 100px li120px
chrome では 2 行表示されます
ie6 では 2 番目の li はその一部を表示します
これは問題ありませんが、奇妙なことに、IE8 では「half a word」が表示されます
コードと対応する CSS 設定を投稿していただけますか
それらのいくつかはラベルの問題ではなく、原因である可能性があるためです。 CSS です。ここにあります
コードと対応する CSS 設定を送っていただけますか
ラベルの問題ではないものもあるため、CSS が
<!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" /><title>无标题文档</title><style>ul{ width:450px;margin:0px;padding:0px;display:block;overflow:hidden;} li { list-style:none; margin-right:5px; padding:0px; height:18px; float:left; display:block; overflow:hidden;}</style></head><body><ul><li>能不能发下，你这块的代码，和相应的CSS设置</li><li>因为有的并不是标签的问题，可能是CSS影响到了</li></ul></body></html> に影響を与える可能性があります width を設定せずに float を実行するにはどうすればよいですか。もっと読んでください。何冊か本を読んでください
幅を設定せずに float を使用するにはどうすればよいですか? 兄弟、もっと本を読んだほうがいいです
はい、幅を設定していません。設定するのは簡単です
あると思いますか?この問題に対するより良い解決策はあるだろうか？幅を設定せずに~~
chrome~~
のように、li の行全体を強制的に 1 行に変更する方法はありますか? または、ie6 のように行を変更せず、改行せずに半文字ie8 では表示される可能性があります
主な理由は、2 番目の li が複数行で表示されるため、オーバーフローを削除するとテキストが複数行になることがわかります。 。
改行を防ぐコントロールを追加するだけです。 。
white-space: nowrap;
li に上記の属性を追加してみてください。
上記のものを追加するだけですが、IE7 ではまだ問題があり、li のオーバーフローを削除する必要があります。
主な理由は、2 番目の li が複数行で表示されていることです。オーバーフローを削除すると、テキストが複数行になることがわかります。 。
改行を防ぐコントロールを追加するだけです。 。
white-space: nowrap;
li に上記の属性を追加してみてください。
上記のものを追加するだけですが、IE7 ではまだ問題があり、li のオーバーフローを削除する必要があります。
コードを書くのはなぜこんなに面倒なのですか! ！ ！ ！ ！ ！
ホワイトスペース: nowrap; 半文字の問題を解決しましょう!
float を使用しない場合、li はラップしません。なぜ強制行ラップが必要ですか?
float を使用しない場合、li はラップしません。 . なぜまだ強制ラッピングを使用するのですか?
li の float 属性を削除するだけです
IE7 では動作しないとのことですが、互換性をテストするツールはありますか?
IE のデバッグ パネルを開くと、その 1 つが次のとおりです: ドキュメント モード。Web ページの解析に使用する IE のバージョンをクリックします。
と違いがわかります
ありがとうございます!
コードを書き始める方法を教えてください。ツールでもコード自体でも、私はいつもそれほど快適ではないと感じます〜
デザインが良くない限り。
これは CSS であり、コードはカウントされません。基本的には誰もそれを望んでいません。
デザインがよければ別ですが。
よくわからない〜！
コードを書くのは絶望的ですね〜？ ? ?
これは IE9 のみにあり、IE9 以降のブラウザーにはこれがあると推定されます。
コード入門:
まず、最も基本的なものについては、W3CSchool にアクセスしてください。十分な時間があれば、これらの基本を学ぶことができます 上手にプレイすることが最も重要です。
CSS だけなら、私は本当に良い本を知りません。JavaScript なら、タオバオのフロントエンドチームが翻訳した『JavaScript Authoritative Guide』がとても良いです。時間があれば、この本を強くお勧めします。この本は何度か読んでみてください、一度読んだだけでは理解できないことがたくさんあります。
次に、コードを書く時間です。情報を読むときに、コードを書くのが苦手だから、すべての例を自分で書いてみてください。同時に、編集ツールについては、最初はプロンプト機能のないエディター (Notepad++、プロンプトなし、構文強調表示付き) を使用できると思います。これらのことを学び始めたばかりの場合は、それらを作成する必要があるためです。 1 つずつ覚えておくと、記憶力が高まり、理解にも役立つはずです。
コード自体に関しては、最初は関数の実装に集中してください。コードの最適化方法については、ゆっくりと実行する必要があります。
ある人のブログ、http://www.zhangxinxu.com/wordpress/ をおすすめしたいと思います。この人の CSS は非常に強力です。今後チェックしてください。
フロントエンド開発のこの側面は始めるのは簡単ですが、改善するのは難しいため、時間があれば適切な基礎を築くことをお勧めします。基本はとても大切です。
私も個人的にはそう思います。
コード入門:
まず、この言語の構文を理解する必要があります。十分な時間があれば、まず W3CSchool にアクセスしてください。これらの基本を学ぶことができます 上手にプレイすることが最も重要です。
CSS だけなら、私は本当に良い本を知りません。JavaScript なら、タオバオのフロントエンドチームが翻訳した『Definitive Guide to JavaScript』がとても良いです。時間があれば、この本を強くお勧めします。 、何度か読んでみると、一度読んだだけでは理解できないことがたくさんあります。
次に、コードを書く時間です。情報を読むときに、同時にすべてのサンプルを書くようにしてください。 、編集ツールについては、最初はプロンプト機能のないエディター (Notepad++、プロンプトなし、構文強調表示あり) を使用できると思います。これらのことを学び始めたばかりの場合は、1 つずつ記述する必要があるためです。覚えやすくなるだけでなく、理解にも役立つはずです。
コード自体に関しては、最初は関数の実装に集中してください。コードの最適化方法については、ゆっくりと実行する必要があります。
ある人のブログ、http://www.zhangxinxu.com/wordpress/ をおすすめしたいと思います。この人の CSS は非常に強力です。今後チェックしてください。
フロントエンド開発のこの側面は始めるのは簡単ですが、改善するのは難しいため、時間があれば適切な基礎を築くことをお勧めします。基本はとても大切です。
私も個人的にはそう思います。
そうだね〜ありがとう〜
li の float 属性を削除するだけです
必要ないと言いました。 IE7で動作します～互換性をテストするツールが何か間違っていますか？
ietest を使用して ie の互換性をデバッグできます