文字重叠错位下的文字阴影效果实现实例页面

展示

代码

CSS代码：

.bg{width:512px; height:340px; margin:1em auto; background:url(//image.zhangxinxu.com/image/study/s/s512/mm19.jpg);}
.font{margin:0; padding:1em; font-size:36px; font-family:"微软雅黑"; float:left;}
.sh{margin:-1px 0 0 -1px; color:#fff; position:absolute;}
            

HTML代码：

<div class="bg">
    <h4 class="font"><span class="sh">张小姐长大了！</span><div>张小姐长大了！</div></h4>
</div>