حل شده
برای این کار از Z-index و Fixed position استفاده کنم
سلام دوستان میخواستم همچین چیزی رو طراحی کنم اما هیچ ایده ای ندارم که چجوری میشه این کار رو کرد .
لینک سایت در اینجا همون عکسی که وقتی اسکرول میکنیم از کد ها هستش رو میگم :)
https://free-learn.ir/beginner-user/
Thanks
ثبت پرسش جدید
پاسخ‌ها
2
بهترین پاسخ
سلام
بله شما میتونید با z-index و fixed position همچین چیزی را طراحی کنید .
<body>
<div>
<section class="top"></section>
<section class="bottom"></section>
</div>
<div class="background"></div>
</body>* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
.background {
position: fixed;
top: 0;
left: 0;
background-image: url(./bg.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height: 100vh;
width: 100%;
z-index: -2;
}
.top {
height: 100vh;
width: 100%;
background-color: rgb(26, 214, 83);
z-index: 5;
}
.bottom {
margin-top: 300px;
height: 100vh;
width: 100%;
background-color: rgb(127, 44, 204);
z-index: 5;
}
گفتگوهای مرتبط
شاید پاسخ شما همین‌جا باشد