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：线性渐变（top，rgba（0,0,0,1），rgba（0,0,0，.5）50％，rgba（0,0,0,1））;

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

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

1 个答案: