在没有JavaScript的情况下缩放字体大小

有没有方法可以在不使用JavaScript的情况下缩放字体大小？例如，如果您打开15英寸笔记本电脑上的网页，并且容器div宽度为400像素，并且字体被定义为填充整个div，然后在17“屏幕上打开网站，div为600像素。有没有办法让字体自动缩放？在没有JavaScript的情况下缩放字体大小

从本质上讲，它增加了一个“宽度：100％”文本，你不能这样做。我宁愿不使用JavaScript，因为我已经在网页上使用了很多东西，并且在一段时间后它变得混乱。

任何帮助，将不胜感激。在此先感谢。

来源

2012-11-13 nickcorin

通常，即使宽度没有改变，也不能依赖字体填充给定的宽度。浏览器和操作系统的字体渲染不同，因此具有相同字体和相同字体大小的相同文本可能会导致渲染文本的像素宽度不同。 – lanzz

感谢您的所有帮助大家，但我最终只是使用文本对齐这样做的：自圆其说。这不完全是我想要的，但它是一个解决方案来拉伸文本。我感谢你的帮助。

来源

2012-11-14 11:17:42 nickcorin

您可以使用媒体查询。根据您的页面/容器的宽度，您可以相应地设置字体大小。

例如：

@media only screen and (max-device-width: 480px) { 
    #container { font-size: 90%; } 
} 

@media only screen and (max-device-width: 600px) { 
    #container { font-size: 100%; } 
}

来源

2012-11-13 16:24:57

谢谢！你能举个例子吗？ – nickcorin

媒体查询如何帮助缩放字体以适合可用___width___？ – lanzz

@lanzz查看已更新的答案 –

添加媒体查询CSS文件。

@media only screen and (max-width: 800px) 
{ 
    body 
    { 
     //font-size or what you want to change 
    } 
}

或者写入外部文件，并导入：

<link rel="stylesheet" href="http://domain.tld/screen.css" type="text/css" media="MediaCssId" />

来源

2012-11-13 16:26:40

在没有JavaScript的情况下缩放字体大小

回答

相关问题