ホームページ  >  記事  >  ウェブフロントエンド  >  ドロップダウン menu_html/css_WEB-ITnose に関する個人的な洞察

ドロップダウン menu_html/css_WEB-ITnose に関する個人的な洞察

WBOY
WBOYオリジナル
2016-06-24 12:18:36953ブラウズ

最初に学習を始めたときは、オンライン チュートリアル を見て
ul タグを使用して学習しましたが、ゆっくりと学習してみると、多くの問題が見つかりました。 。
1. ULの互換性はブラウザによって大きく異なります。
2. ul を使用するのは非常に柔軟性がありません。li を 1 つ変更すると、それらはまとめられるため、ul を変更する可能性があります。 そこで、他の方法を考えて、内側の div が外側の div よりも大きいようにしました。この場合、マウスを外部 div に移動すると内部 div が表示されますが、IE6 では内部 div が外部サイズより大きい限り、外部 div は確実に表示されます。引き伸ばされます。つまり、内部 div と同じサイズに拡張されます。同じサイズで、内部 div がオーバーフローするのを防ぎます。

そこで考えて、内側のdivのオーバーフロー方式をオーバーフローの相対配置方式に変更して、外側のdivが引き伸ばされないようにしました。
IE6~10、FF、safari、chrome、operaでテスト済み、問題ありません。 。

私の個人的な感覚としては、CSS のさまざまなプロパティについてはよく知っていますが、多くの問題は実際に操作してからでないと発見できないということです。
以前は 1 つのブラウザをテストしただけで問題ないと感じましたが、ブラウザの互換性を確認した後は問題がありませんでした。テストを行ったところ、このメソッド
には制限があることがわかりました。オンライン チュートリアルも別のブラウザーで実行すると、表示される結果も異なります
。 。多くのドロップダウン メニューが

    を使用して作成されているのを見てきましたが、実際にはこれを使用するのはあまり好きではありません。 。
    それでも div は最高で最も多用途です。



    ディスカッションへの返信 (解決策)

    IE6 は本当に不正行為を行っており、問題は IE6 にあることがわかりました。 。ほとんどのブラウザはこれを通過できます
    IE6 が最適です。 。 。本当に淘汰される時期が来たのか?

    JP 実際、IE6 の寿命はまだ 400 日以上あります。実際、UL でメニューを作成するのは非常に簡単で、クロスブラウザの問題も簡単に解決できます。


    外側の div が引き伸ばされないように、内側の div のオーバーフロー方法をオーバーフローの相対配置方法に変更します。あなたの文の背後にあるアイデアは、実際には、外部要素が引き伸ばされないように、内部要素のレイアウトを失わせることです。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。