Nasıl Yapılır - Karanlık Modu Değiştir
CSS ve JavaScript ile karanlık ve aydınlık mod arasında geçiş yapın.
Sınıfı Değiştir
Adım 1) HTML'yi ekleyin:
Tasarımını değiştirmek istediğiniz içeriği depolaması gereken herhangi bir öğeyi kullanın. Örneğimizde, <body>
basitlik adına kullanacağız:
Örnek
<body>
Adım 2) CSS'yi ekleyin:
Öğeye stil <body>
verin ve geçiş için bir .dark-mode
sınıf oluşturun:
Örnek
body {
padding: 25px;
background-color: white;
color: black;
font-size: 25px;
}
.dark-mode {
background-color: black;
color: white;
}
Adım 3) JavaScript'i ekleyin:
Öğeyi alın ve sınıf <body>
arasında geçiş yapın :.dark-mode
Örnek
function myFunction() {
var element =
document.body;
element.classList.toggle("dark-mode");
}
İpucu: Ayrıca, Sınıf Nasıl Eklenir konusuna bakın .
İpucu: JavaScript Referansımızda classList özelliği hakkında daha fazla bilgi edinin .