برای این کار از Z-index و Fixed position استفاده کنم

سلام دوستان میخواستم همچین چیزی رو طراحی کنم اما هیچ ایده ای ندارم که چجوری میشه این کار رو کرد .
لینک سایت در اینجا همون عکسی که وقتی اسکرول میکنیم از کد ها هستش رو میگم :)
https://free-learn.ir/beginner-user/

Thanks

ثبت پرسش جدید

Banana Life

@shift.delete 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;
}

ارسال پاسخ

ماهان ملک جاری

تخصص : برنامه نویسی تحت وب / backend...

@MrMahan1392 2 سال پیش مطرح شد

https://www.mediafire.com/file/5csgtt94zfy8ya1/Rach.rar/file

ارسال پاسخ

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام

دوره‌های آموزشی

مسیرهای یادگیری

پیشرفت من

دوره‌های رایگان

گواهی پایان دوره

محبوب‌ترین آموزش‌ها

برای این کار از Z-index و Fixed position استفاده کنم

گزینش سوالات

گفت و گو های مرتبط

دسته ‌بندی سوالات

تگ‌های محبوب

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید