微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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及以下版本中不支持文字阴影.我建议只将它用于非必要的样式:确保当阴影/人造轮廓不存在时,文本仍然可读.

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。