私はこのウェブサイトがこれをどのように行っているかを何時間も理解しようとしてきました. [] に移動してブラウザー画面のサイズを変更すると、ブラウザーのサイズが小さくなるにつれて、中央のメイン コンテンツ コンテナーが小さくなることがわかります。それはどのように機能しますか?
私が構築しているワードプレスのウェブサイトで同様のことをしようとしています。
ありがとう、AJ
メイン列に積み重ねられたすべての要素の幅は 65% で、これは親要素の比率を表します。この場合、それはビューポートの幅全体です。最小幅は 700px に設定され、最大幅は 1920px にサイズ変更されます。非常に単純な CSS。
Firebug および/または Chrome および Safari の開発者ツールバーに慣れてください。これらは、Web サイトを扱うすべての人にとって不可欠です。
あなたはそれがレスポンシブであると言っていると思います。CSS @media クエリを使用して、ブラウザーの解像度に応じてサイトの幅を変更する可能性があります。
詳細については、http : //mobile.smashingmagazine.com/2010/07/19/how-to-use-css3-media-queries-to-create-a-mobile-version-of-your-websiteをご覧ください。 /
また、あなたのサイトはその良い例ではありません。ここでより良い例を参照してください: http://mediaqueri.es/