在沒有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的情況下縮放字體大小

回答

相關問題