【问题标题】:Change font-size with media queries使用媒体查询更改字体大小
【发布时间】:2022-08-11 16:15:41
【问题描述】:

我想更改表头的字体大小。 应用程序在桌面查看时应该很大,在手机上显示时会变小。

th {
  @media screen and (max-width: 699px) {
    font-size: xx-large;

  }  
  @media screen and (max-width: 700px) {
    font-size: small;

  }  
  
}

我不太确定这是否是正确的方法。

    标签: css media-queries responsive


    【解决方案1】:

    这样做的方法是像在大屏幕上一样设置th 元素的样式,然后设置媒体查询为小屏幕应用不同的样式。

    th{
      font-size: large-font-size;
    }
    

    然后现在编写要在较小屏幕上应用的不同样式。

    @media screen and (max-width: 700px) {
        font-size: smaller-font-size;
      } 
    

    【讨论】: