İlginizi Çekebilir
HTML Responsive

CSS ID Kullanımı

CSS ID Kullanımı

HTML kodlarımızın içerisinde CSS ile özelleştirmeler yaptığımız zaman, özelleştirme bölümlerini tanımlamak için iki tane öznitelik kullanmaktayız. Bunlardan birincisi: Class özniteliği , ikincisi: ID özniteliğidir.
ID, CSS sınıfında kimlik anlamına gelmektedir. Bir öğrenin benzersiz kimliğini belirtmek amacıyla kullanılır. ID’nin benzeri bulunmaz. Kod içerisinde aynı ID sahip birden fazla etiket olamaz.

<style> … </style> etiketlerinin içerisinde ( # ) hastag işaretiyle belirtilir.

CSS ID Kullanımı
Önerilen Yazı
CSS Class Kullanımı

Birden fazla örnek ile ID kullanımının nasıl olduğuna ayrıntılı bir şekilde bakalım.
 

1ID bölümü oluşturmak ve özelleştirmek


İlk olarak body içerisinde h1 etiketiyle bir id oluşturalım.

 
Ardından CSS özelleştirmelerini yapmak için, <head></head> bölümü içerisinde
<style></style> bölümü açalım.

 
Şimdi oluşturduğumuz style bölümü içerisinde, h1 başlığımızın özelleştirmelerini yapalım.

CSS ID Kullanımı

 
 

2Birden fazla farklı etiketlere ID tanımlama


Kod yapısı içerisinde birden fazla etiket üzerinde id tanımlaması yapılabilir.

Şimdi bu içeriğimizi özelleştirmek için CSS kodlarımızı yazalım.

Merhaba dostum!

Merhaba burası 1. Başlığın içeriğidir. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Vestibulum sit amet sapien vitae mi efficitur placerat. Suspendisse potenti. Morbi accumsan, enim
non malesuada blandit, metus purus interdum ex, eu facilisis risus elit non tortor. Ut scelerisque
augue ut euismod faucibus. Proin interdum at sem vel suscipit. Mauris faucibus, est non maximus.

CSS ID kullanımı

Selam dostum!

Merhaba burası 2. Başlığın içeriğidir. Donec id lectus lacinia, pharetra sem ac, aliquet felis.
Mauris ac lacus vitae dolor pretium pulvinar ac eget elit. Nunc libero leo, accumsan a tellus quis
ortis dapibus eros. Pellentesque orci quam, sollicitudin vitae odio eget, finibus sagittis ante ruen,
euismod ante est, ut faucibus metus dapibus ac. Donec sollicitudin sapien vel mauris sagittis, feugiat

Yorum Yap

Yorum Yap