PCサイトをスマホで見たときの文字サイズ

Question

お世話になっております。

内容はまだまだではありますが、楽天大学などを受講し、
初めてのお客様向けに当店の紹介ページを作りました。

カテゴリ、「初めてのお客様へ」でページを作成したのですが、
該当商品がないので、スマホで見てもPCページ内容が表示されます。

htmlのtable以外は、適度に文字サイズが大きくなって見やすいのですが、
tableの中の文字サイズは、PCで見たときと同様のサイズで、
table外の文字サイズより小さく読みにくくなっています。

PCで見たときの文字サイズを変更することなく、
スマホで見たときのtable内のPCサイトの文字サイズを変更するには
どうすればよいでしょうか。

どうぞ、よろしくお願いします。

Accepted Answer

ECマスターズの田中です。

私のiPhone6sにて確認したところ、
table内外の文字サイズは
ほぼ同じ大きさとなっておりましたが、
どの機種でご覧いただいておりますでしょうか。

念のため、画面の横幅を判断し、
スマートフォンのサイズだった場合は
文字の大きさを変更する方法を
ご案内いたします。

カテゴリ説明文の中に、下記HTMLソースをご記載ください。

===== この下の行から ================

@media only screen and (max-width: 767px) {
table[width="100%"][cellspacing="2"][cellpadding="0"][border="0"] * { font-size: 15pt; }
}

===== この上の行まで ================

※ブラウザの横幅が767px以下になると適用されるため、
　解像度の低いディスプレイで操作している時など、
　PCで見ている時の横幅が狭い場合も、同様に適用されます。
※「15pt」の数値を操作することで、
　スマートフォンで見た時の文字の大きさを調整することができます。

Answer

ご回答ありがとうございます。

Chrome、以前メルマガでご紹介いただいたBLISKで見ると
文字サイズが小さくなっておりましたが、
実際のスマホでみると、記載いただいたとおり、文字サイズはほぼ同じになっていました。

お手数おかけしました。