Kurs önerileri:class CSS .

Seçici

tanımlama ve kullanım .class özellik değeri olan tüm türdeki elementleri seçmek için bir nokta ( class CSS

özellik değeri olan elementleri seçmek için.) karakteri, ardından class öznitelik değeri olan elementleri seçmek için

element.class özellik değeri olan tüm türdeki elementleri seçmek için bir nokta ( class öznitelik değeri olan elementleri seçmek için seçici kullanılır.

özellik değeri olan belirli elementleri seçmek istiyorsanız class türünden bir elementi seçmek istiyorsanız, element adını yazın, ardından bir nokta (.) karakteri, ardından class öznitelik değeri (Aşağıdaki örnek 2'ye bakın) içerebilir.

İpucu:HTML elementleri birden fazla class(Aşağıdaki örnek 3'e bakın)。

Örnek

Örnek 1

class="intro" olan tüm elementlerin stillerini seç ve ayarlayın:

.intro {
  background-color: yellow;
}

Kişisel olarak deneyin

Örnek 2

class="intro" olan tüm <p> elementlerinin stillerini seç ve ayarlayın:

p.intro {
  background-color: yellow;
}

Kişisel olarak deneyin

Örnek 3

.class Seçicilerin farklı kullanımları:

/* class="center" olan tüm elementleri seç */
.center {
  text-align: center;
}
/* class="large" olan tüm <p> elementlerini seç */
p.large {
  font-size: 200%;
}
/* class listesinde "fancy" ve "beige" içeren tüm <p> elementlerini seç */
p.fancy.beige {
  font-family: 'Courier New', monospace;
  background-color: beige;
  border: 2px solid green;
}
/* class="ex1" olan <p> elementi içindeki tüm class="ex2" elementlerini seç */
p.ex1 .ex2 {
  background-color: yellow;
}

Kişisel olarak deneyin

CSS dilbilgisi

.class {
  css ifadeleri;
}

CSS dilbilgisi

element.class {
  css ifadeleri;
}

Teknik ayrıntılar

Sürüm: CSS1

Tarayıcı desteği

Chrome Edge Firefox Safari Opera
Destek Destek Destek Destek Destek

İlgili sayfalar

CSS Eğitimi:CSS sınıf seçici

CSS Eğitimi:CSS sınıf seçici açıklaması