html - 如何更改 Jumbotron 内文本的渐变颜色？

Question

我一直在到处寻找正确的代码来仅更改 Jumbotron 中的文本(标题)。

这是我得到的:

    <div class="jumbotron">
        <div class="container text-center">
            <h1 class="method2">Title here</h1>
            <p>Sub-heading</p>
        </div>

我想改变这个标题的渐变色。我在某处看到了这样的 css 代码:

h1.method2{
-webkit-mask-image: -webkit-linear-gradient(top, rgba(0,0,0,1), rgba(0,0,0,.5) 50%, rgba(0,0,0,1));
-webkit-mask-image: linear-gradient(top, rgba(0,0,0,1), rgba(0,0,0,.5) 50%, rgba(0,0,0,1));
 }

我面临的问题是我的“此处标题”位的底部似乎被切断了一点，所以我尝试重新调整底部边距，但它也没有那样工作。所做的只是将副标题推到下方。

我也不确定这种渐变模式究竟是如何工作的。关于 Bootstrap 的字体渐变着色似乎没有很多解释。

有人可以解释我是否做错了什么以及它是如何工作的吗？

谢谢。

Answer 1

如果您下载了 css 并将其放在您的文件夹中，请找到该行

.jumbotron .h1

在里面粘贴你发布的代码

-webkit-mask-image: -webkit-linear-gradient(top, rgba(0,0,0,1), rgba(0,0,0,.5) 50%, rgba(0,0,0,1)); -webkit-mask-image: linear-gradient(top, rgba(0,0,0,1), rgba(0,0,0,.5) 50%, rgba(0,0,0,1));

就是这样，如果你从他们的网站导入 css，你将不得不覆盖它