html - 如何在手机上更改字体大小？

Question

我目前有这个在桌面上显示的 html 代码。如何添加特定的移动代码，以便在移动设备上将字体大小减小到 35 像素？

<div style="float: left; width: 100%;" class="sapMktBlock">
<h3 class="mobileheader" style="margin: 10px 0px 30px; line-height: 50px; letter-spacing: normal; font-family: Baskerville; font-size: 50px; font-style: normal; font-weight: normal; display: block; color: #000000 !important; text-align: center;">Looks Like Something <br />Caught Your Eye</h3>
<table class="deviceWidth" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; mso-line-height-rule: exactly; border-collapse: collapse !important; margin: 0 auto; max-width: 600px;" border="0" cellspacing="0" cellpadding="0" align="center">
<tbody>
<tr></tr>
</tbody>
</table>
</div>

标签： htmlcss

Answer 1

您可以像这样使用媒体查询。

移动视口大小从 360 x 740 不等，其中 360 是宽度，740 是高度

@media (max-width:360px){
    // Write your code Here, for example
    .my-text{
        font-size:12px;
        color : red;    
    }
}