ホームページ  >  に質問  >  本文

Netlify デバイスのモバイル ビューが正しく動作しない

このサイトの CSS は、デスクトップ バージョンやメディア クエリを使用して作成されたモバイル バージョンと同様に、私のコンピュータでは正常に機能しますが、モバイル デバイスで表示すると CSS が機能しなくなります。ウェブサイトのリンク: https://lightheart-basbousa-3c2db6.netlify.app/、リポジトリのリンク https://github.com/hetyug04/portfolioV7。 netlify でホストされていますが、これまで問題があったことはありません。これは私の携帯電話でのモバイルビューです

P粉276876663P粉276876663427日前532

全員に返信(2)返信します

  • P粉476547076

    P粉4765470762023-09-10 12:20:00

    CSS は小さい画面サイズで実行されています。

    ブラウザの開発ツールを使用すると、intro クラスに display: none を含むメディア クエリがあることがわかります。これは、1015 ピクセル以下の画面に影響します。メディア クエリを変更または削除すると、出力が変更されます。

    なぜそれが存在するのか、そしてそれを削除することで問題が完全に解決されるかどうかはわかりませんが、これを確認することが最初のステップとなるはずです。

    オーバーフローや不正な幅など、他にもいくつかの問題があります。モバイルファーストの設計アプローチをチェックしてみてください。

    返事
    0
  • P粉757640504

    P粉7576405042023-09-10 10:34:56

    問題は解決しました。どうやら、スタイルシート内で CSS スタイルをネストしており、スタイルのネストを解除すると、CSS がモバイル ブラウザで動作し始めたことが原因のようです。

    返事
    0
  • キャンセル返事