html5 – Firefox中的文字笔画和阴影CSS3

嘿,我想知道如果有一种方式添加笔触和阴影的文本,我可以让它工作在Chrome和Safari,因为webkit支持文本笔画和文本阴影.我可以得到在Firefox中显示的笔画,但是使用文字阴影和使用偏移量.有没有人知道这个问题的方法.

解决方法

文本笔画属性不是标准CSS规范的一部分,因此最好避免使用它 – Chrome可以随时将其拉出.

您可以使用多个逗号分隔的文本阴影创建文字笔画效果 – 实际上您可以使用相同的技术添加“实际”阴影：

h1 {
    font-size: 100px;
    font-weight: bold;
    text-shadow: 1px 1px 0 #F00,-1px -1px 0 #F00,1px -1px 0 #F00,-1px 1px 0 #F00,3px 3px 5px #333;
}​

请注意,因为IE9及以下版本中不支持文字阴影.我建议只将它用于非必要的样式：确保当阴影/人造轮廓不存在时,文本仍然可读.