我有问题。我正在使用物化 CSS。我用 html
<img class="parallax">
尝试视差标记,但有没有办法在 CSS 中为您提供背景图像,同时还使其具有视差。
我的示例代码:
内容 html:
<div class="row parallax-container">
<div class="parallax">
<div class="intro headerBackground">
<h1 class="grey-text text-lighten-5">Data</h1>
<h5 class="grey lighten-4 grey-text text-darken-1">Data</h5>
</div>
</div>
</div>
内容 CSS:
.intro
{
text-align: center;
padding-top: 13%;
padding-bottom: 13%;
margin-bottom: 50px;
}
.intro h1
{
font-weight: 900;
text-transform: uppercase;
}
.intro h5
{
text-transform: uppercase;
background-color: #fafafa;
padding: 10px;
display: inline-block;
font-size: 1.2rem;
}
.headerBackground{
height:800px;
background-image:url('images');
background-repeat:no-repeat;
background-position:center;
background-size: cover;
}
最佳答案
请尝试:-
<div class="row parallax-container">
<div class="parallax headerBackground">
<div class="intro">
<h1 class="grey-text text-lighten-5">Data</h1>
<h5 class="grey lighten-4 grey-text text-darken-1">Data</h5>
</div>
</div>
关于html - css 中的背景图像并赋予它视差,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39831351/