我正在寻找一种在我的内联背景图像之上应用线性渐变的方法。我试图调整 CSS 样式,但类被放置在图像下方。
<div class="header__bkgd" v-bind:style="{'background-image': 'url(' + require('~/assets/images/dist_bkgd.jpg') + ')'}"></div>
最佳答案
可以使用此 css background 样式在图像顶部添加渐变:
background: linear-gradient( rgba(0, 23, 32, 0.5) 100%, rgba(255, 32, 32, 0.5) 100%),
url('/static/bg.jpg') no-repeat center center fixed;
希望这对您有所帮助!
关于css - 如何在 Nuxt/Vue 中做内联线性渐变,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51525170/