Sınıf vs ID
Basamaklı Stil Sayfaları (CSS), bir biçimlendirme dili kullanılarak yazılmış bir belgenin görünümünü ve biçimlendirmesini açıklayan bir dildir. CSS, HTML ile yazılmış web sayfalarını biçimlendirmek için yaygın olarak kullanılır. CSS, HTML öğeleri için stiller uygulamaya ek olarak kendi stil seçicilerinizi belirlemenize olanak tanır. Bu, ID ve sınıf seçicileri kullanılarak yapılır. Tek bir benzersiz öğe için bir stil belirtirken, kimlik seçici kullanılır. Bir grup eleman için bir stil belirlerken sınıf seçici kullanılır.
Sınıf Nedir?
CSS'de, bir grup öğeye kendi stilinizi uygulamak için Sınıf seçici kullanılabilir. Sınıf seçici, aynı sınıfa sahip bir dizi öğeye belirli bir stil uygulamak için kullanılır. CSS'de bir sınıf seçici, bir nokta (.) ile tanımlanır. Aşağıda CSS'de tanımlanmış bir sınıf seçici örneği verilmiştir.
.my_class {
renk: mavi;
yazı tipi ağırlığı: kalın;
}
HTML, aşağıda gösterildiği gibi öznitelik sınıfını kullanarak CSS'de tanımlanan sınıfa başvurabilir.
Bu benim biçimlendirmem
Bu yine benim biçimlendirmem
Yukarıda gösterildiği gibi, aynı sınıf birden çok öğe için kullanılabilir ve tek bir öğe birden çok sınıf kullanabilir. Aynı öğede birden çok sınıf kullanıldığında, sınıflar aşağıda gösterildiği gibi bir boşlukla sınırlandırılmış sınıf özniteliğine eklenir.
Bu benim iki sınıf kullanarak biçimlendirmem
Kimlik nedir?
CSS'de kimlik seçici, kendi stilinizi tek bir benzersiz öğeye uygulamak için kullanılabilir. CSS'de, bir kimlik seçici, bir kare () ile tanımlanır. Aşağıda CSS'de tanımlanan bir kimlik seçici örneği verilmiştir.
my_ID {
renk: kırmızı;
metin hizalama:sağ;
}
HTML, aşağıda gösterildiği gibi öznitelik kimliğini kullanarak CSS'de tanımlanan kimlik seçiciye başvurabilir.
Bu benim biçimlendirme formum bir kimlik seçicidir
Kimlikler benzersizdir. Bu nedenle, her öğenin yalnızca tek bir kimliği olabilir ve her sayfa, o belirli kimliğe sahip yalnızca tek bir öğeye sahip olabilir. Kimlikler, bir tarayıcı ile kullanılabilecek önemli bir özelliğe sahiptir. Sayfa URL'si bir karma değer içeriyorsa (ör. https://myweb.commy_id), tarayıcı "my_id" kimliğine sahip öğeyi otomatik olarak bulmaya çalışacak ve bu öğeyi görüntülemek için web sayfasını kaydıracaktır. Bu, tarayıcının o öğeyi bulabilmesi için sayfanın o belirli kimliğe sahip tek bir öğeye sahip olmasının bir nedenidir.
Sınıf ve Kimlik arasındaki fark nedir?
Bir web sayfasındaki öğelere kendi stilinizi uygulamak için hem Sınıf seçici hem de Kimlik seçici kullanılabilse de, bazı önemli farklılıkları vardır. Sınıf seçici, bir grup öğeye kendi stilinizi uygulamak için kullanılabilirken, ID seçici, tek bir benzersiz öğeye stil uygulamak için kullanılır. Kimlikleri kullanırken, her öğe yalnızca tek bir kimliğe sahip olabilir ve her sayfa bu belirli kimliğe sahip yalnızca tek bir öğeye sahip olabilir, ancak Sınıf birden çok öğe için kullanılabilir ve tek bir öğe birden çok Sınıf kullanabilir. Ayrıca, kimlik, o kimliğe sahip öğeyi görüntülemek üzere bir sayfayı otomatik olarak kaydırmak için kullanılabilir, ancak bu, sınıf seçiciyle mümkün değildir.