媒体查询和基本字体大小

时间:2015-10-20 18:07:30

标签: css css3 media-queries

嘿,伙计们可以为此提供帮助。我设计使用移动第一个网站,其中14px字体大小的移动设备,16个平板电脑和18个桌面我想转换为em。我的问题是在媒体查询中我应该为每种类型的屏幕重新定义基本字体,还是仅使用14px基本字体并转换为em? 提前谢谢。

1 个答案:

答案 0 :(得分:2)

也许你可以试试视口大小的排版。如果你想要响应式字体,那就太棒了。 CSS3有一些新值用于调整相对于当前视口大小的内容:vw,vh和vmin

例如:

1vw = 1% of viewport width
1vh = 1% of viewport height
1vmin = 1vw or 1vh, whichever is smaller
1vmax = 1vw or 1vh, whichever is larger

用法:

h1 {
  font-size: 5.9vw;
}
h2 {
  font-size: 3.0vh;
}
p {
  font-size: 2vmin;
}

更多关于此链接: https://css-tricks.com/viewport-sized-typography/