ホームページ >ウェブフロントエンド >htmlチュートリアル >DIV+CSS フローティング問題のまとめ [増加中]_html/css_WEB-ITnose

DIV+CSS フローティング問題のまとめ [増加中]_html/css_WEB-ITnose

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

1.
マージンの問題を解決するには、通常、border:1px Solid #333; 属性を別の div に追加します。これを使用して、どのレイヤーが伸びて開いているかを確認します。
------------------------------------------------------------
最も一般的なもの伸びる問題は

です
ffのfloat属性がめちゃくちゃになるので各レイヤーの最後にこのようなレイヤーを追加しますfloat属性あり、ffのfloat属性をオフにするには使用します。
ただし、このレイヤーはie6に配置すると一定の間隔を占めます。解決策は次のとおりです:

----------------- -------------------------------------------------- -------------------------
2.
IE6ではアプリフローティング+マージンが表示されます 注意距離が 2 倍になる現象は IE6 でのみ発生します。通常、この現象は IE6 用のハックである _margin を使用することで解決できます。
------------------------------------------------- -------------------------------------------------- ------
3.
float に設定された div に対して ie で設定されたマージンが 2 倍になります。これはie6に存在するバグです。解決策は、display:inline; を追加することです
例: <#div id="imfloat">
対応する CSS は
#IamFloat{ float:left;
margin:5px;/*IE では 10px です*/ display:inline;/*IE では 5px*/} として認識されます
つまり、display:inline という文を追加するだけです。

UL のパディングとマージン
ul タグには、FF ではデフォルトでパディング値がありますが、IE ではデフォルトでマージンのみが値を持つため、最初に
ul を定義します
{margin:0;padding:0;}
--- --- ---------------------------------------------- --- ----------------------------------------------- --
4.


    日本]
    [2009 年 2 月 18 日]
    [2009 年 2 月 18 日] Cangliu [2009 年 2 月 18 日]
float:right; を追加します
このようにして、右の float が一定の距離だけ沈む時間を求めます
解決策:
li a{display:inline; に display:inline-block;float:left; 属性を追加します-block;float:left;}
2. a タグを span タグと直接交換することでも問題を解決できます。
  • [2009 年 2 月 18 日]滄口店-幸せな WikiGou は 2 月 2 日を一緒に過ごします
  • 理由: ラベルはフロートを追加することでブロックレベルの要素に変換されます
    ----------- ---------------------------------------------------- --------------------------------------
    5.左フローティング要素の場合は、一番右端から開始して、最初の障害物にぶつかるまで左にフローティングし、その隣に位置します
    --------------- ----------- -------------------------------------- --------------------------------------
    6.
    フロートのクリア方法:
    1、
    フローティング div または他の要素の後ろに配置してフローティングをクリアします。これは HTML 内の冗長なコードを増やすことになるため、お勧めできません。
    2. 外側の要素に css を次のように定義します。


    .wrapperElem{ overflow:hidden; width:auto;}
    .innerElem{ float:left;}
    これで innerElem の浮動問題が解決されます。外側の要素の CSS に注意してください。ここで width を削除すると、IE6 で問題が発生することがわかります。width:1% を追加することでも解決できます。
    声明:
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。