CSS 实现立体字效果

我们在工作中,很多场景会遇到立体文字,今天我们就来实现下,很简单,算是水文章吧:

<h1>立体字体</h1>

h1 {
  margin: 100px 0 0 100px;
  font-size: 5em;
  color: #fff;
  text-shadow: -1px 1px #bbb,
  -2px 2px #bbb,
  -3px 3px #bbb,
  -4px 4px #bbb,
  -5px 5px #bbb,
  -10px 10px #666;
}

在这里插入图片描述

相关推荐

  1. css动画旋转效果实现

    2024-01-31 15:48:02       54 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-01-31 15:48:02       98 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-01-31 15:48:02       106 阅读
  3. 在Django里面运行非项目文件

    2024-01-31 15:48:02       87 阅读
  4. Python语言-面向对象

    2024-01-31 15:48:02       96 阅读

热门阅读

  1. docker幻兽帕鲁

    2024-01-31 15:48:02       59 阅读
  2. springboot整合redis

    2024-01-31 15:48:02       53 阅读
  3. FPGA芯片的可重构技术

    2024-01-31 15:48:02       74 阅读
  4. MySQL数字类型超出范围时的溢出处理

    2024-01-31 15:48:02       65 阅读
  5. [Python]窗体自动化解决方案之图形匹配

    2024-01-31 15:48:02       60 阅读