HTMLメールの文字サイズをPCとスマホで変更する

<style type="text/css"><!--
/* スマホ */
@media screen and (max-width: 480px) {
.f16 { font-size: 14px !important; }
}
/* PC */
@media screen and (min-width: 481px) {
.f16 { font-size: 16px !important; }
}
--></style>

HTMLメールの文字サイズをPCとスマホで変更するため、あらかじめclassを作成します。
今回はPCが16px、スマホが14pxになるようにCSSで文字サイズを指定しています。

<!-- テキスト -->
<tr>
<td width="600"><span style="color:#333333;font-size:16px;line-height:150%;" class="f16">テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</span></td>
</tr>

テキストにclassを指定します。
ただし、headタグ内のCSSが効かないメーラーもありますので（Outlookなど）styleでも直接を font-size を記述しています。
PCの方がCSSが効かないメーラーが多いので、PCの文字サイズを指定するようにしています。