根據屏幕分辨率更改TD字體大小

我正在尋找一個非常基本的示例，如果屏幕分辨率爲1024 * 768或更低，它將更改TD字體大小。根據屏幕分辨率更改TD字體大小

表格和佈局非常適合任何分辨率，但標準字體在此分辨率下稍微偏大。所以，我希望能找到一個辦法只有改變字體..

目前我的CSS是在一個單獨的文件，幷包含此爲TD：

table.format td { 
    padding: 3px 10px; 
    text-align: center; 
    color: #333; 
    font-size:10pt; 
}

的CSS後載入我能確定屏幕大小，然後覆蓋這個值？

任何想法或指針？

來源

2013-01-10 JeffVader

使用'em'或''％insted的pt'的'和'px' – Champ

使用CSS媒體查詢是這樣的：

table.format td { 
    padding: 3px 10px; 
    text-align: center; 
    color: #333; 
    font-size:10pt; 
} 

@media screen and (max-width:480px){ 
    table.format td { 
    font-size:16pt; 
    } 
} 


@media screen and (max-width:1024px){ 
    table.format td { 
    font-size:12pt; 
    } 
} 


@media screen and (max-width:1920px){ 
    table.format td { 
    font-size:10pt; 
    } 
}

你可以改變最大/最小寬度以適合您的需求

來源

2013-01-10 09:28:50

會更好只在最大寬度來定義字體大小：480像素，然後最大寬度：1,024像素x和最後分鐘寬度：1024 – nicolallias

試試這一個CSS3。在瀏覽器窗口調整大小的情況下，它甚至可以減少額外的腳本。

http://css-tricks.com/viewport-sized-typography/

來源

2013-09-05 09:38:08

鏈接可能中斷。請在這裏添加說明 – Kathir

不知道該服務器有什麼問題。你可以看看下面的文章，它解釋了使用視口單元的相同概念。 http://generatedcontent.org/post/21279324555/viewportunits –

根據屏幕分辨率更改TD字體大小

回答

相關問題