EN

Search
Close this search box.

موستانگ، وحشیِ دوست داشتنی

پاسخ داده شد
0
0

فرض کنید دو تگ img (یا هر المان دیگر) داریم و می خواهیم این دو را روی هم بندازیم. چطور می توانیم این کار را انجام دهیم؟

Images stacked using HTML - موستانگ

  • شما باید برای ارسال دیدگاه شوید
پاسخ عالی
0
0

با کمک position: absolute می توانید این کار را انجام دهید:

<!DOCTYPE html>
<html>
<head>
  <title>Two Images on Top of Each Other</title>
  <style>
    .container {
      position: relative;
      width: 400px;
      height: 400px;
    }
    .image {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  </style>
</head>
<body>
  <div class="container">
    <img class="image" src="image1.jpg" alt="Image 1">
    <img class="image" src="image2.jpg" alt="Image 2">
  </div>
</body>
</html>

 

*در اینجا ما یک container تعریف کردیم و position آن را برابر releative گذاشتم و بعد دو تگ img تعریف کردیم و مقدار top: 0 و left: 0 را تعریف کردیم و position آن ها را نیز absolute گذاشتیم تا روی هم قرا بگیرند.

  • شما باید برای ارسال دیدگاه شوید
نمایش 1 نتیجه
پاسخ شما
اگر قبلاً حساب کاربری دارید با پر کردن فیلد های زیر یا به عنوان مهمان ارسال کنید.
نام*
ایمیل*
وب سایت