プロが教えるわが家の防犯対策術！

iPhoneがメディアクエリーを認識しない？

解決済

  • 質問者：Chown
  • 質問日時：
  • 回答数：1件

iPhone8

パソコンのブラウザーで下のコードを読むと、ブラウザーの横幅に合わせて、640px以下なら、フォントサイズが変わります（大きくなります）。

しかし、iPhoneで閲覧すると、文字が小さい（メディアクエリーが適用されない）です。コードが間違っているでしょうか。

教えてください。お願いします。（初心者のおかしな質問だと思いますが、お許しください）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio …
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>メディアクエリーテスト</title>
<style>

@media screen and (max-width:640px) {
.text {
font-size:32px;
}
a {
font-size:18px;
}
}

</style>
</head>

<body>
<center>
<p class="text">
テキストテキストテキストテキストテキストテキストテキスト
</p>
<hr/>
<a href="#">＜リンクテキスト＞</a>
</center>
<hr/>
</body>

</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (1件)

No.1ベストアンサー

  • 回答者： fujillin
  • 回答日時：

こんばんは



<head>内に以下を追記してもだめでしょうか？

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    • good
    • 1
    • 件
通報する
この回答へのお礼

fujillinさん、ご回答ありがとうございます。

解決しました！　スマホには viewport という設定が必要なのですね。エディターで作っているだけでは、全く意識しないのでわかりませんでした。

とても勉強になりました。

通報する
お礼日時：2021/05/20 23:25

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報