javascript - 如果检测到移动用户，如何缩小表格文本？

Question

我的JS:

window.onload = function(){
    if(/Android|webOS|iPhone|Windows Phone/i.test(this.navigator.userAgent)){
        document.getElementById('datatable').style.fontSize = "10px";
    } else {
        document.getElementById('datatable').style.fontSize = "20px";
    }
}

HTML:

<table class="TFtable" id="datatable">
  ...
</table>

请注意:目前没有与字体大小相关的样式会影响“TFtable”类。

Answer 1

您可以使用 CSS 媒体查询来定位视口(viewport)小于 600 像素的设备。

@media only screen and (max-width: 600px) {
  table.TFtable {
    font-size: /* your smaller font size*/;
  }
}