CSS - 目標非文字陰影支持的瀏覽器

是否有任何CSS黑客的目標只是不支持text-shadow CSS屬性的瀏覽器？CSS - 目標非文字陰影支持的瀏覽器

這是一個非常重要的可見性/可讀性/訪問性問題，因爲像具有白色BG一個黑影淺灰色文本，如果黑暗文字陰影是不可見的可能變得不可讀。設計師堅持使用它，而不是使用文本圖像替換。（我可以嘗試和目標最近的瀏覽器，但我有驚喜，即使IE9不理解text-shadow，上帝只知道這是在所有的移動設備支持這一點在那裏...）

來源

2012-06-17 NeuronQ

你的設計師需要一個嚴重的可訪問性速成班。 – BoltClock

[谷歌文本陰影填充工具（http://www.google.com/search?q=text+shadow+polyfill） - > https://github.com/heygrady/textshadow –

@BoltClock我知道，但設計實際上看起來不錯，很容易閱讀與文本陰影渲染正確... – NeuronQ

你必須使用這個腳本：

if (document.createElement('div').style.textShadow !== '') { 
    document.documentElement.className += ' no-textshadow'; 
}

然後，你可以這樣做：

.no-textshadow h1 { 
    background: #fff; 
    color: #000; 
}

來源

2012-06-17 08:08:27 jasssonpet

謝謝，我希望只有一個CSS解決方案，以避免像Modernizr加載功能檢測庫，但你的解決方案也足夠輕... – NeuronQ

不是沒有JS，但有一個可行的CSS-僅替代，我相信對於IE 6-9作品和有效。聽說過DXImage變換？

類似問題+語法示例：Is filter: progid:DXImageTransform.Microsoft.DropShadow(OffX="x", OffY="y", Color="color") a viable replacement for text-shadow: in IE?

來源

2012-06-17 08:08:51 whiskeySteve

謝謝，儘管我不想在IE中留下文字陰影，只是在陰影不被支持以改變文本的可讀性時改變文本顏色......並且我仍然需要實際測試幾個在那裏的移動瀏覽器...... – NeuronQ

CSS - 目標非文字陰影支持的瀏覽器

回答

相關問題