CSS3 实用技巧：漂亮的文本渐变效果

最新推荐文章于 2024-07-01 15:53:36 发布

qq_45670012

最新推荐文章于 2024-07-01 15:53:36 发布

阅读量119

点赞数

分类专栏：前端文章标签： css3 我的博文

原文链接：https://www.mk2048.com/blog/blog.php?id=haj2kjk0icab&title=CSS3+%E5%AE%9E%E7%94%A8%E6%8A%80%E5%B7%A7%EF%BC%9A%E6%BC%82%E4%BA%AE%E7%9A%84%E6%96%87%E6%9C%AC%E6%B8%90%E5%8F%98%E6%95%88%E6%9E%9C

版权

前端专栏收录该内容

1223 篇文章 6 订阅

订阅专栏

您可能感兴趣的相关文章

2012年最酷的25个 CSS3 学习教程
35个让人惊讶的 CSS3 动画效果演示
推荐12个漂亮的 CSS3 按钮实现方案
20个非常绚丽的 CSS3 特性应用演示
24款非常实用的 CSS3 工具终极收藏

漂亮的文本渐变效果

h2[data-text] {
  position: relative;
}
h2[data-text]::after {
  content: attr(data-text);
  z-index: 10;
  color: #e3e3e3;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), color-stop(50%, rgba(0,0,0,1)), to(rgba(0,0,0,0)));

更多实用 CSS3 技巧：帮助你美化网站的10 实用 CSS3 技巧

编译来源：梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

更多专业前端知识，请上【猿2048】www.mk2048.com