时间戳

首页 > 解决方案 > 同一行中的标题背景3颜色

html - 同一行中的标题背景3颜色

问题描述

.heading {
    background-color: #FFC20E;
    font-size: 23px;
    font-weight: 600;
    padding: 5px 0px 5px 22px;
    font-family: "Open Sans";
}
<h3 class="heading">Heading</h3>

我有一个带有 3 种背景颜色的标题，我该怎么做请建议，作为参考，我附上了图片，请帮助在此处输入图像描述

标签： htmlcssbackground

解决方案

使用 CSSgradient

.heading {
background: #fcc601; 
background: -moz-linear-gradient(left,  #fcc601 0%, #fcc601 46%, #ffdb71 46%, #ffdb71 73%, #fff0c5 73%, #fff0c5 100%);
background: -webkit-linear-gradient(left,  #fcc601 0%,#fcc601 46%,#ffdb71 46%,#ffdb71 73%,#fff0c5 73%,#fff0c5 100%);
background: linear-gradient(to right,  #fcc601 0%,#fcc601 46%,#ffdb71 46%,#ffdb71 73%,#fff0c5 73%,#fff0c5 100%);

    font-size: 23px;
    font-weight: 600;
    padding: 5px 0px 5px 22px;
    font-family: "Open Sans";
}
<h3 class="heading">Heading</h3>

推荐阅读