如何總是有一個40-70個字符寬的頁面？ scren，mobile，print

如何使用當前的CSS最佳實踐來平衡不同媒體（垂直手機屏幕或整頁打印）和每行40至80個字符的舒適字體大小？如何總是有一個40-70個字符寬的頁面？ scren，mobile，print

我想我知道常規屏幕鑽，設置身體的字體大小，以一定比例，標誌着與寬度爲70em和最小寬度40EM你的主要內容元素...

但後來，我什麼都不知道關於移動和打印這個問題的公認標準。

我所有的搜索嘗試帶我去（現在）從2002年〜2011徒勞的形式討論[EM，像素％，PT]在其他的待遇。

2012-06-24 gcb

body { 
    min-width: 16em; 
    min-width: 40ch; 
    max-width: 28em; 
    max-width: 70ch; 
}

使用ch單元對於「字符寬度」，並使用em單位的設置進行備份，其數值約爲所需字符數的40％。

em單位表示字體的大小。對於拉丁字母的文字，這大約是字符平均寬度的40％，也許更多一點。

ch單位表示數字0的寬度。它通常是CSS中「平均字符寬度」的最佳可用近似值。它受到現代瀏覽器的支持，但對於少於現代瀏覽器，首先在em單位設置寬度。

這回答您的消息標題中的問題。信息的主體含糊不清，不構成可以建設性解決的問題。

來源

2012-06-24 06:44:39

對於大多數字體，一個ch是1/2 em。但是1/2 em在每個瀏覽器上都得到了廣泛的應用:)如果屏幕尺寸小於這個尺寸會發生什麼？應該使用哪個回退？ – gcb

設置相對於字符大小的頁面寬度只有在使用單體字體時纔有意義。考慮這兩個字符串「iiiiiiiiii」和「WWWWWWWWWW」 - 都由10個字符組成，但顯然需要一個不同寬度的容器！

你可以玩ex/em/ch units，但他們不會給你完整的控制來完成你想要做的事情。另外：ch甚至沒有完全支持！

Fiddled示例

來源

2012-06-24 06:47:12

我沒有太多的線條，充滿了我的和W的:)我用我平常的風格所表現的東西就是這樣的（如果CSS沒有被魔鬼實現）'p {min-width：20em;寬度：40em;最大寬度：80％; }'這給我一個很好的40-80字符寬的行，並沒有使用整個頁面。當然，由於實現，我得到了一堆嵌套元素。 – gcb

@gcb：只要文本開始包裝（即> 1行總數），最大的允許值將優先 - 段落是塊，並且需要以這種方式設置它們的尺寸。你應該能夠根據選擇的字體計算出一個適當的比率來表示* em中的* 40平均字符寬度*。這表明每個字符的平均值爲1en = 1em/2：http://www.microsoft.com/typography/news/glossary/ch6.htm –

ex/em/ch單位只是其他名稱你與他們有問題。它們是固定的像素度量，只是相對於某些任意字符大小。唯一會採取介紹帳戶解決方案的措施是pt。但是每一個實現（嗡嗡聲，甚至是規範）都沒有用，但是回到了主題上。使用em/en/ex/ch /等，你仍然需要一種設置相對於屏幕真實狀態的字體大小的方法。 – gcb

如何總是有一個40-70個字符寬的頁面？ scren，mobile，print

回答

相關問題