ホームページ  >  記事  >  ウェブフロントエンド  >  シャオカイがみんなに質問です。 _html/css_WEB-ITnose

シャオカイがみんなに質問です。 _html/css_WEB-ITnose

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

Groupon.com、Juhuasuan、Taobao では、製品が 1 つずつ表示され、左右、上下に隙間があり、製品表示全体の幅はタイトル バーの幅と同じです。上のナビゲーションバー。しかし、自分で作成したときは、ほんの少しずれているか、マージン右を使用してギャップのサイズを設定していたため、常に上の行と整列しませんでした。この効果を実現するためのより良い方法があるかどうかを皆さんに尋ねたいと思います。コードを投稿して見てみるのが最善です。皆さん、ありがとうございました。


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

幅制御問題について
幅+マージン+パディング+ボーダーの合計が線の制限幅を超えていないか慎重に計算してください。

上の階の正解は、LZ がボックス モデルの概念を理解してから実践することをお勧めします

モデルを作成して CSS に作成し、毎回この正しいクラスを使用し、作業を繰り返さないでください
直接行うこともできます。他の人のWebサイトのCSSを直接​​使用してください

まず、ボックスモデルとフロートが何であるかを理解しましょう。これを理解すると、何をすればよいかわかると思います

また、フロートの概念はもっとあると思います。重要。

ちゃんと浮いています。 。 。 。実は、ボックスモデルは写真を見ただけで分かります
フローティングと位置決めについて、私は長い間混乱していました

それを紹介するためのより良い情報があるかどうか

にとって最も重要なこと。ポスターは左右2枚の位置です。他にも左右があります。組版が最も使いやすい表です。 div+cssを使ってシミュレートする場合、固定幅の場合、左のfloatの後に右マージンがあるため、同じ行の最後のマージンは注意して削除する必要があります

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