الگو:فهرست: تفاوت میان نسخه‌ها
بدون خلاصۀ ویرایش |
بدون خلاصۀ ویرایش |
||
| خط ۱۶: | خط ۱۶: | ||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
justify-content: space-between; | justify-content: space-between; | ||
background-color: #2c3e50; /* رنگ پس‌زمینه هدر */ | background-color: #2c3e50; /* رنگ پس‌زمینه هدر */ | ||
padding: 10px 20px; | padding: 10px 20px; | ||
| خط ۹۰: | خط ۹۰: | ||
<div class="logo">تحلیل روز</div> | <div class="logo">تحلیل روز</div> | ||
<div class="menu"> | <div class="menu"> | ||
<a href="#">فارکس ارزها</a> | <!-- Dropdown for "فارکس ارزها" --> | ||
<a href="#">فارکس کالاها</a> | <div class="dropdown"> | ||
<a href="#">ارز دیجیتال</a> | <a href="#">فارکس ارزها</a> | ||
<a href="#">بازار داخلی</a> | <div class="dropdown-content"> | ||
<div class="dropdown-title">ارزها</div> | |||
<a href="#">یورو</a> | |||
<a href="#">پوند</a> | |||
<a href="#">دلار کانادا</a> | |||
<a href="#">ین ژاپن</a> | |||
</div> | |||
</div> | |||
<!-- Dropdown for "فارکس کالاها" --> | |||
<div class="dropdown"> | |||
<a href="#">فارکس کالاها</a> | |||
<div class="dropdown-content"> | |||
<div class="dropdown-title">کالاها</div> | |||
<a href="#">انس طلا</a> | |||
<a href="#">انس نقره</a> | |||
<a href="#">نفت</a> | |||
</div> | |||
</div> | |||
<!-- Dropdown for "ارز دیجیتال" --> | |||
<div class="dropdown"> | |||
<a href="#">ارز دیجیتال</a> | |||
<div class="dropdown-content"> | |||
<a href="#">بیت‌کوین</a> | |||
<a href="#">اتریوم</a> | |||
<a href="#">بایننس</a> | |||
<a href="#">دوج</a> | |||
</div> | |||
</div> | |||
<!-- Dropdown for "بازار داخلی" --> | |||
<div class="dropdown"> | |||
<a href="#">بازار داخلی</a> | |||
<div class="dropdown-content"> | |||
<a href="#">طلا</a> | |||
<a href="#">سکه</a> | |||
<a href="#">دلار</a> | |||
<a href="#">درهم</a> | |||
</div> | |||
</div> | |||
</div> | </div> | ||
<div class="logo">آرشیو | <div class="logo">آرشیو تحلیل</div> | ||
</div> | </div> | ||
<script> | |||
// اضافه کردن اسکریپت برای باز و بسته کردن منوها | |||
const dropdowns = document.querySelectorAll('.dropdown'); | |||
dropdowns.forEach(dropdown => { | |||
dropdown.addEventListener('click', function(e) { | |||
e.preventDefault(); // جلوگیری از عملکرد پیش‌فرض | |||
const content = dropdown.querySelector('.dropdown-content'); | |||
content.style.display = content.style.display === 'block' ? 'none' : 'block'; // تغییر وضعیت نمایش منو | |||
}); | |||
}); | |||
</script> | |||
</body> | </body> | ||
</html> | </html> | ||
نسخهٔ ۱۵ نوامبر ۲۰۲۴، ساعت ۱۳:۲۸
<!DOCTYPE html>
تحلیل روز
آرشیو تحلیل