私は 2 つの異なるレスポンシブ Web サイトに取り組んでいます (どちらも進行中で、1 つは練習用に lynda.com から取得したものです)。私が行ったこの最初のものは、私が知る限りうまくいきます。HTML はHEREで、CSS はHEREです。
次に、これに取り組み始め、上記と同じ css を作成しましたが、@media のみの画面と (最大幅: 768px) を対象とするメディア クエリが何らかの理由で読み込まれません。HTML はHEREで、CSS はHEREです。理由を理解しようと何時間も費やしましたが、道に迷っています。2つの違いはありませんが、一方は機能しており、もう一方は機能していません。あなたが持っている提案は大歓迎です！
私は今、ブラウザでそれらをテストしています。
ありがとう！
問題は、あるサイトの HTML に「meta...viewport...」があり、他のサイトではそのステートメントがコメントアウトされていることだと思います。
「meta...viewport...」のないサイトでは、メディア クエリは実際には、「画面」ではなく、制約のない「ビューポート」のサイズに対してテストしています (単純化しすぎていると、「デバイスは時々嘘をつきます」)。一方、「meta...viewport...width=device-width」を使用するサイトでは、「ビューポート」の幅は、メディアクエリがテストする前に「画面」の幅と同じになるように強制的に下げられるため、さまざまな答えが得られます (特に小さなデバイスでは)。
(対象とするデバイスによっては、「ビューポート」を完全に理解する必要がある場合があります。「ビューポート」の動作には十分な理由があります。私の皮肉な「デバイスは時々嘘をつく」を誤解しないでください。 「ビューポートは悪い考えだ」という意味です。)