1

私はレスポンシブ デザインの Web サイト、より具体的には複数の Div を組み込んだページで作業しています。Web ページのサイズを変更すると、パーセンテージとして設定されているため、div の幅が変化します。高さは一定に保つ必要があるため、div が消えない限り、ブレークポイントを設定して高さを変更する必要があります。高さを変更しない場合、高さは一定のままで、下の div 間に「マージン」が追加されます。基本的に、私のロジックは次のとおりです。ウィンドウのサイズが変更され、幅が 810px 未満の場合、すべての CSS スタイルを削除し、余白の上に項目 2 から無限大を追加します。これは文章で説明するのが難しいので、最後に次のコードを追加しました。

ブラウザー ウィンドウのサイズを変更し、コンテンツ div が 810 ピクセル未満の場合、スタイリングが削除されません。私のコードを見ると、何が原因でしょうか?

関数は 27 ～ 50 行にあります: https://github.com/jdmagic21/coded_container/blob/master/work.js

4

2 に答える 2

0

CSSメディアクエリを使用して、このように行うことができます。

@media screen and (max-width: 810px) {
     /* reset the styles of the divs here */
}
于 2012-12-30T03:40:27.357 に答える
0

JavaScript で行うよりも、CSS メディア クエリを使用して、ブラウザーの幅に応じてスタイルを変更することを検討してください。

ここにチュートリアルがあります - 「CSS メディアクエリの使用方法」の Google でのトップヒットの 1 つです。

以下は、メディア クエリのブラウザー互換性の表です。IE8 以前をあまり気にしなければ大丈夫です。

于 2012-12-30T02:04:18.733 に答える