css中的Photoshop風格反鋸齒樣式

我正在爲我們的新網站PSD樣板設置樣式表。模型中的大部分文本都使用photoshop中的「尖銳」抗鋸齒方法。css中的Photoshop風格反鋸齒樣式

重新創建這些類型的photoshop抗鋸齒方法的最佳方式是什麼？設置不同的字體權重似乎遙遠..

順便說一句，字體是宋體所以沒有搞笑@字體面的東西會在這裏

2011-04-15 John Hunt

我會將文本預渲染爲圖像，但這是可能經常更改的正文文本，顯然我們不希望將圖像用於一切！ – 2011-04-15 00:58:57

一個簡單的選擇是text-shadow，這是一個CSS3屬性：

#foo { 
    /* text-shadow: [color] [horizontal offset] [vertical offset] [blur] */ 
    text-shadow: #fff 0 1px 0; 
}

與設置玩弄;通過嘗試不同的顏色和模糊值，您可以製作出非常尖銳的前端光滑字體。

2011-04-15 00:27:41

顯然這不是一顆銀彈，但我必須說它的效果是相當令人滿意的。 – 2011-04-15 00:57:55

因爲你的網站會在多個操作系統的多個瀏覽器中顯示，沒有辦法獲得一致的字體顯示。我認爲這是關於字體平滑的操作系統。

如果您需要它，請將這些部分渲染爲圖像或使用Cufon或sIFR。

我也曾在過去做過，如果字體有點粗糙，可以添加一個細微的CSS3 text-shadow，這會讓它看起來更平滑。

2011-04-15 00:26:04 alex

您可以使用基於腳本的庫（想起cufón）來自定義消除鋸齒和其他文本渲染效果。請注意，大多數（如果不是全部的話）這樣的解決方案只適用於標題和什麼，而不是全文正文。

2011-04-15 00:26:48

font-smooth的CSS3屬性可能是有用的：

font-smooth: auto | never | always | <absolute-size> | length | initial | inherit

2011-04-15 00:27:02 drudge

回答