このサイトの CSS は、デスクトップ バージョンやメディア クエリを使用して作成されたモバイル バージョンと同様に、私のコンピュータでは正常に機能しますが、モバイル デバイスで表示すると CSS が機能しなくなります。ウェブサイトのリンク: https://lightheart-basbousa-3c2db6.netlify.app/、リポジトリのリンク https://github.com/hetyug04/portfolioV7。 netlify でホストされていますが、これまで問題があったことはありません。これは私の携帯電話でのモバイルビューです
P粉4765470762023-09-10 12:20:00
CSS は小さい画面サイズで実行されています。
ブラウザの開発ツールを使用すると、intro クラスに display: none
を含むメディア クエリがあることがわかります。これは、1015 ピクセル以下の画面に影響します。メディア クエリを変更または削除すると、出力が変更されます。
なぜそれが存在するのか、そしてそれを削除することで問題が完全に解決されるかどうかはわかりませんが、これを確認することが最初のステップとなるはずです。
オーバーフローや不正な幅など、他にもいくつかの問題があります。モバイルファーストの設計アプローチをチェックしてみてください。
P粉7576405042023-09-10 10:34:56
問題は解決しました。どうやら、スタイルシート内で CSS スタイルをネストしており、スタイルのネストを解除すると、CSS がモバイル ブラウザで動作し始めたことが原因のようです。