火焰字

最新推荐文章于 2021-07-01 00:44:43 发布

原创最新推荐文章于 2021-07-01 00:44:43 发布 · 491 阅读

0 ·

CC 4.0 BY-SA版权

css3 专栏收录该内容

11 篇文章

订阅专栏

本文介绍了一种使用HTML5和CSS3创建火焰文字效果的方法。通过特定的CSS样式设置，包括字体大小、颜色及阴影等属性，可以实现逼真的火焰文字显示效果。

火焰字

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
body {    background:#000;}
p {
    text-align: center;
    font:bold 60px helvetica, arial, sans-serif;
    color: red;
    text-shadow: 0 0 4px white, 
    0 -5px 4px #ff3, 
    2px -10px 6px #fd3, 
    -2px -15px 11px #f80, 
    2px -25px 18px #f20;

}
</style>![这里写图片描述](https://img-blog.youkuaiyun.com/20170803160728023?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdHl1dGphdmFsaWx5/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
</head>

<body>
<p>HTML5+CSS3</p>
</body>
</html>