私は、モバイル デバイス用に設計されていない Web サイトの構築を引き継ぎました。クライアントは少なくともモバイルデバイスを介してサイトをナビゲートできる必要があるため、モバイルデバイスでもブラウザーとまったく同じようにサイトが表示され、クライアントがピンチしてズームできるようにしようとしています。それ。メディアクエリを介していくつかの小さな調整を行う必要がありましたが、それは別の話です.
サイトは素晴らしく見え<meta name="viewport" content="user-scalable=yes" />ますが、メディア クエリが有効になっているようには見えません...width=device-widthメタ タグを挿入すると、サイトが爆発し、300% ズームで表示されているように見えます。次のいずれかを配置すると、initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0単に配置したときと同じ効果が得られますwidth=device-width
これまでのところ、私が探しているものに近い唯一のものはuser-scalable=yes、メタタグに他に何もないだけですが、メディアクエリは有効ではありません. メディアクエリを持っている必要がありますwidth=device-widthか?initial-scale
これは、私が使用している、有効になっていないメディアクエリの 1 つです。
@media only screen and (max-width: 879px) {}