css3火焰文字样式代码
文章图片
css样式：
body{background:#000;
}
*{margin:0;
padding:0;
transition:all 1s;
}.dv1{
text-align:center;
font:bold 60px helvetica,arial,sans-serif;
color:#F00;
padding:24px;
text-shadow:0 0 4px #FFF,0 -5px 4px #ff3,2px -10px 6px #fd3, -2px -15px 11px #f80, 2px -25px 18px #f20;
}
.dv2{
text-align:center;
padding:24px;
font:helvetica,arial,sans-serif;
font-size:80px;
font-weight:bold;
color:#006;
background:#CCC;
text-shadow:-2px -2px #FFF,3px 3px #333;
}
.dv3{
text-align:center;
padding:24px;
font:helvetica,arial,sans-serif;
font-size:80px;
font-weight:bold;
color:#006;
background:#666;
text-shadow:2px 2px #FFF,-3px -3px #333;
}
.dv4{
text-align:center;
padding:24px;
font:helvetica,arial,sans-serif;
font-size:80px;
font-weight:bold;
color:#006;
background:#CCC;
text-shadow:-3px 0 #000,0 2px #000,2px 0 #000,0 -3px #000;
}
.dv5{
text-align:center;
padding:24px;
font:helvetica,arial,sans-serif;
font-size:80px;
font-weight:bold;
color:#006;
background:#999;
text-shadow:0 0 0.2em #f87,0 0 0.2em #f87;
}
.dv6{
background:#0CC;
font-size:80px;
padding:20px 0px 20px 0px;
font-weight:bold;
color:#006;
text-align:center;
}.dv6 a{color:#fff;
display:block;
text-decoration:none;
transition-property:border, color, text-shadow;
transition-duration:1s, 2s ,3s;
text-shadow:0 1px hsla(0, 0% 100%, 1.0);
}
.dv6 a:hover{color:#000;
text-shadow:0px 1px white;
transform:translate(-40px,-10px)}.dv7{width:100%;
overflow:hidden;
padding:20px 0px 20px 0px;
}
.dv7 a{background:#000;
font-weight:bold;
display:block;
text-decoration:none;
transition-property:border, color, text-shadow;
transition-duration:1s, 2s ,3s;
text-shadow:0 1px hsla(0, 0% 100%, 1.0);
color:#006;
text-align:center;
font-size:80px;
}
.dv7 a:hover{color:#000;
text-shadow:0px 1px white;
transform:skew(10deg,2deg);
}.dv8{width:100%;
overflow:hidden;
padding:20px 0px 20px 0px;
}
.dv8 a{background:#999;
font-weight:bold;
display:block;
text-decoration:none;
transition-property:border, color, text-shadow;
transition-duration:1s, 2s ,3s;
text-shadow:0 1px hsla(0, 0% 100%, 1.0);
color:#006;
text-align:center;
font-size:80px;
}
.dv8 a:hover{color:#000;
text-shadow:0px 1px white;
transform: scale(1.7);
}html掩码：
css3文字特效
css3文字特效
css3文字特效
css3文字特效
css3文字特效
css3文字特效
css3文字特效
css3文字特效
查看掩码：www.100sucai.com/code/1881.html
【css3火焰文字样式代码】转载于:https://www.cnblogs.com/good10000/p/4528355.html
推荐阅读
- 时光，是行走在文字里的眷恋
- 罗塞塔石碑的意义（古埃及文字的起源，圣书体文字是如何被破解的）
- 琉璃心
- 【散文诗】河流
- 【孩子的文字】星
- springboot结合redis实现搜索栏热搜功能及文字过滤
- 小文字大温暖
- 如何做得到
- 文字里的|文字里的 X X是个什么鬼（）
- 【文字的力量】｜大漠深处生死相随