css字体实现渐变

简介: css字体实现渐变
.title {
    font-family: 'Electronic';
    font-size: 1.5em;
    /* 背景渐变 */
    background: linear-gradient(90deg, #114357 0%, #F29492 100%);
    /* 元素背景延伸到文本 */
    -webkit-background-clip: text;
    /* 文本字符填充颜色透明 ,让文字透明,就能填充上*/
    -webkit-text-fill-color: transparent;
 
}

tip:在需要使用的地方引入即可

原理:背景渐变,再让文字透明,背景延伸至文字

目录
相关文章
|
30天前
|
前端开发
css 设置背景色渐变、字体颜色渐变
css 设置背景色渐变、字体颜色渐变
|
26天前
|
存储 前端开发 安全
详解CSS之Web 字体
详解CSS之Web 字体
22 4
|
2月前
|
前端开发
【前端web入门第三天】02 CSS字体和文本
本文详细介绍了CSS中字体和文本的相关属性。字体部分涵盖字体大小、粗细、样式、行高、字体族及`font`复合属性,通过具体示例展示了如何设置和使用这些属性。文本部分则讲解了文本缩进、对齐方式、修饰线及文字颜色等属性,并提供了实用的代码示例。此外,还简要介绍了调试工具中的一些细节,如错误属性标识和属性生效状态的控制。
63 28
|
3月前
|
前端开发 Ubuntu Linux
CSS 系统字体堆栈参考
CSS 系统字体堆栈参考
31 0
|
3月前
|
缓存 前端开发 Linux
如何使用 @font-face 和 font-display 在 CSS 中定义自定义字体
如何使用 @font-face 和 font-display 在 CSS 中定义自定义字体
78 0
|
5月前
|
Web App开发 前端开发 Windows
CSS基础常用属性之字体属性(如果想知道CSS的字体属性知识点,那么只看这一篇就足够了!)
CSS基础常用属性之字体属性(如果想知道CSS的字体属性知识点,那么只看这一篇就足够了!)
|
5月前
|
前端开发 UED 容器
CSS基础-文本样式:颜色、字体、大小、对齐
【6月更文挑战第8天】本文介绍了CSS中设置文本颜色、字体、大小和对齐的基础知识。通过color属性改变文本颜色,使用font-family设置字体,用font-size调整大小,text-align控制对齐方式。注意浏览器兼容性、文本溢出和响应式设计的问题。提供的代码示例展示了这些属性的用法,帮助创建更具吸引力的网页。
58 6
|
5月前
|
Web App开发 移动开发 前端开发
Web网页制作-知识点(3)——HTML5新增标签、CSS简介、CSS的引入方式、选择器、字体属性、背景属性、表格属性、关系选择器 二
Web网页制作-知识点(3)——HTML5新增标签、CSS简介、CSS的引入方式、选择器、字体属性、背景属性、表格属性、关系选择器 二
48 1
|
5月前
|
移动开发 前端开发 HTML5
Web网页制作-知识点(3)——HTML5新增标签、CSS简介、CSS的引入方式、选择器、字体属性、背景属性、表格属性、关系选择器一
Web网页制作-知识点(3)——HTML5新增标签、CSS简介、CSS的引入方式、选择器、字体属性、背景属性、表格属性、关系选择器 一
75 1
|
4月前
|
Web App开发 前端开发
设计,兼容性----字体-------Css样式的字体,字体样式导入
设计,兼容性----字体-------Css样式的字体,字体样式导入