本文主要是介绍学习探索-给字体设置前景色，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
给字体设置前景色
- 效果示例图
- 代码
效果示例图
代码
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>给字体设置前景色</title><style type="text/css">* {padding: 0px;margin: 0px;box-sizing: border-box;}html,body {height: 100vh;display: flex;justify-content: center;align-items: center;}.clip {display: inline-block;font-size: 36px;background: linear-gradient(to right, #bc2c24, #7533ca);/* * text:背景被裁剪成文字的前景色*/background-clip: text;-moz-background-clip: text;-webkit-background-clip: text;color: transparent;}</style></head><body><div class="clip">HELLO WRODL!</div></body>
</html>这篇关于学习探索-给字体设置前景色的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
