javascript - 如何设置正文相对于屏幕大小的字体大小

标签 javascript html css

好吧,我目前正在做一些事情,但现在我正在构建一个移动版本,对于那个移动版本,我想设置相对于窗口的文本大小。我试着这样做:

// Getting the right font-size
var viewportWidth  = document.documentElement.clientWidth;
var viewportHeight = document.documentElement.clientHeight;
document.getElementsByTagName("body")[0].style.fontSize = (viewportHeight / 10);

但出于某种原因,它告诉我:

Uncaught TypeError: cannot read 'style' of type undefined.

你们能帮我解决这个问题吗,或者有其他方法(可能是用 css)来解决我的问题。

谢谢。

最佳答案

您的错误消息告诉您 document.getElementsByTagName("body")[0] 给您 undefined。因此,在脚本运行时您没有 body 元素(因此您无法更改其样式)。

或者:

  • 将其移出head
  • 把它变成一个函数可以在读取/加载文档等时调用

此外,CSS font-size 属性需要一个长度,而长度需要单位。

关于javascript - 如何设置正文相对于屏幕大小的字体大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19814484/

相关文章:

javascript - 如何用javascript引用https

javascript - 如何使用 javascript 从上传的音频文件或音频文件 URL 创建 MediaStream?

javascript - 如何通过onclick将<div>更改为&lt;input&gt;

javascript - 如何在一行中干燥我的 jQuery 代码

html - div高度的过渡效果

javascript - 我怎样才能让这个 eval() 调用在 IE 中工作?

重新加载期间的 Javascript Retina/HD 显示检测和阻止页面呈现

javascript - 获取元素位置

css - float : Right Not Working

javascript - 如何通过@input 属性应用样式,我想增加 mat-autocomplete 的宽度