CSS'de id ve sınıf arasındaki fark

İçindekiler:

Anonim

NS asıl fark CSS'de id ve sınıf arasında id, benzersiz bir öğeye stil uygulamak için kullanılırken, sınıf, birden çok öğeye stil uygulamak için kullanılır.

Web geliştirmede çeşitli teknolojiler vardır. Web siteleri geliştirmek için ana diller HTML, CSS ve JavaScript'tir. HTML, Hiper Metin İşaretleme Dili anlamına gelir. Web sayfasının yapısını geliştirmeye yardımcı olur. JavaScript, web sayfasını daha dinamik hale getirmeye yardımcı olur. CSS, Basamaklı Stil Sayfaları anlamına gelir. Stiller eklemeye ve web sayfalarını daha gösterilebilir hale getirmeye yardımcı olur. CSS kuralları, HTML öğeleri için geçerlidir. Ayrıca, CSS seçicileri, öğeleri bulmaya ve gerekli stili HTML etiketlerine uygulamaya yardımcı olur. id ve class iki tür seçicidir.

Sınıf, CSS Kuralları, Kimlik

CSS Kuralları Nelerdir?

CSS bir dizi kuraldan oluşur. Tarayıcı bu kuralları yorumlayabilir ve bunları belgede belirtilen öğelere uygulayabilir. Bir CSS stil kuralı üç bölümden oluşur. Bunlar seçici, özellik ve değerdir. Beyanname, mülkiyet ve değerin birleşimini ifade eder. Aşağıdaki gibi bir çift kaşlı ayraç içinde görünürler.

seçici { özellik: değer; }

seçici – Stili uygulamak için öğeyi tanımlamaya yardımcı olur

Mülk - Bir nitelik. Tüm HTML nitelikleri CSS özelliklerine dönüştürülür. Bazı örnekler renk, metin hizalama, kenarlık vb.

Değer – Değer, özelliğe atanan şeydir. Örneğin, özellik rengine mavi atanabilir.

kimlik nedir

Programcı, öğelerin kimliğine dayalı olarak bir stil kuralı tanımlayabilir. Aynı kimliğe sahip tüm öğeler, tanımlanan stille uygulanacaktır. Belirli bir kimliğe sahip bir öğe seçmek için, öğenin kimliğinden sonra bir # (karma) sembolü olmalıdır.

HTML dosyasının aşağıdaki gibi bir ifade içerdiğini varsayalım.

CSS dosyası aşağıdaki kod parçasını içerir.

#header1{

renk: mavi;

}

Tarayıcı HTML ifadesini yorumlarken, CSS dosyasında başlık1 olan h1 öğesinin kimliğini kontrol eder. Ardından tanımlanan CSS kuralını h1 öğesine uygular. Bu nedenle, Merhaba Dünya metni mavi renkte görünecektir.

Kimlik, sayfa içinde benzersizdir. Bu nedenle, kimlik seçici, benzersiz bir öğe için kullanılır.

sınıf nedir

Kimliğe benzer şekilde, programcı, öğenin sınıfına dayalı olarak stil kurallarını tanımlayabilir. Aynı sınıfa sahip tüm öğeler, tanımlanmış bir stille uygulanacaktır. Belirli bir sınıfa sahip bir öğe seçmek için bir. (nokta) sembolü ve ardından sınıfın adı.

HTML dosyasının aşağıdaki ifadeleri içerdiğini varsayalım.

CSS dosyası aşağıdaki kod parçasını içerir.

.header1{

renk: mavi;

}

Tarayıcı HTML deyimini yorumladığında, CSS dosyasında başlık1 olan h1 öğesinin sınıfını kontrol eder. Ardından tanımlanan CSS kuralını tüm h1 öğelerine uygular. Bu nedenle Hello World 1 ve Hello World 2 metni mavi renkte görünecektir.

Aynı sınıfı birden fazla eleman üzerinde kullanmak mümkündür. Bu nedenle, sınıf seçici birden çok öğe için kullanılır.

CSS'de id ve sınıf arasındaki fark

Tanım

id, CSS'de öğeye belirli bir kimliğe göre stil veren bir seçicidir, oysa sınıf, CSS'de seçilen öğelere belirtilen bir sınıfla stil veren bir seçicidir.

Sözdizimi

Kimlik sözdizimi şudur: #id{ css bildirimleri; }. Sınıf sözdizimi.class { css bildirimleridir; }

kullanım

Ayrıca, kimliğin kullanımı, belirli bir öğeye stil uygulamaktır. Sınıfın kullanımı, birden çok öğeye stil uygulamaktır.

Çözüm

Kimlik ve sınıf, CSS'de HTML öğelerine stil uygulanmasına izin veren iki seçicidir. CSS'deki id ve sınıf arasındaki temel fark, id'nin tek bir benzersiz öğeye stil uygulamak için kullanılması, sınıf ise birden çok öğeye stil uygulamak için kullanılmasıdır.

Referans:

1. “CSS Sözdizimi ve Seçiciler.” W3Schools Çevrimiçi Web Eğitimleri, Buradan ulaşabilirsiniz.

Görünüm inceliği:

1. “CSS.3” Nikotaf tarafından - Commons Wikimedia aracılığıyla kendi eseriniz (CC BY-SA 4.0)

CSS'de id ve sınıf arasındaki fark