这篇文章给大家分享的用css给文字添加阴影的内容,整体的实现就是文字添加长阴影的效果,这样的好处就是可以增加字体的立体感,那么具体怎样做呢?下面我们一起来了解一下。
 
  实现如下图效果
 
 
 
  主要知识点
 
  css中的字体阴影 text-shadowless
 
  语法中的 loops 和 merge代码
 
  <div class="long-shadow">屮艸芔茻</div>
   .loop(@counter) when (@counter > 0) {
      .loop((@counter - 1));
      text-shadow+: (1px * @counter) (1px * @counter) #2d585a;
    }
   .long-shadow{
      overflow: hidden;
      background-color: #5f9ea0;
      width:800px;
      height: 160px;
      line-height: 160px;
      text-align: center;
      letter-spacing: 80px;
      color: #fff;
      font-size: 100px;
      .loop(200);
    }
大型站长资讯类网站! https://www.0518zz.cn