چگونه حالت تاریک را تغییر دهیم

با استفاده از CSS و JavaScript بین حالت تاریک و روشن جابجایی کنید.

آپ خود بپردازید

تبدیل کلاس

مرحله اول - اضافه کردن HTML:

از هر عنصری که باید محتوای طراحی قابل تغییر شما را ذخیره کند، استفاده کنید. در مثال ما، برای سادگی، ما از <body>:

<body>

مرحله دوم - اضافه کردن CSS:

تنظیم <body> استایل عناصر و ایجاد یک کلاس برای تغییر .dark-mode کلاس:

body {
  حاشیه: 25px;
  رنگ پس‌زمینه: سفید;
  رنگ: سیاه;
  اندازه فونت: 25px;
}
.dark-mode {
  رنگ پس‌زمینه: سیاه;
  رنگ: سفید;
}

مرحله سوم - اضافه کردن JavaScript:

دریافت <body> عنصر و در .dark-mode تبدیل بین کلاس‌ها:

function myFunction() {
  var element = document.body;
  element.classList.toggle("dark-mode");
}

آپ خود بپردازید

صف مرتبط

教程：کہاں سے کلاس جوڑنا ڈولس کرسکتا ہو؟

参考手册：HTML DOM عنصر کی classList پر کیا کرسکتا ہو؟