CSS Başlangıç: id selector kullanımı

Daha önceki örneklerimizde inline css kullanımını ve h1, h2, h3 etiketlerinin biçimlendirmesini incelemiştik, bu bölümde bir adım daha ileri giderek, css biçimlendirmelerini id seçiciler kullanarak yapacağız. Bu işlem için yine html sayfamızın head bölümünde <style> etiketleri arasında aşağıdaki gibi id tanımını yapıyoruz. 

#bicim {
    font-size:14;
    color:yellow;
    background:red
}

id seçiciler # (şarp)  işareti ile başlar. Süslü parantezler arasında biçimlendirme kodlarımızı yazarız, daha sonra hangi html etiketini biçimlendirmek istiyorsak o etikette id kullanımını yapıyoruz.

Örneğin; yukarıdaki #bicim id seçicisi ile h1 etiketini biçimlendirmeyi aşağıdaki şekilde kullanıyoruz.

<h1 id="bicim">Biçilendirilmiş h1 Etiket</h1>

Şimdi aşağıdaki kodlamayı yapalım.

<html>
<head>
<title>CSS Örnek3</title>
<meta charset="utf-8"/>
<style>
     #bicim{ font-size:14; color:yellow; background:red}
     #bicim2{ font-size:20; color:blue; background:yellow}
</style>
 
</head>
<body>
     <h1 id="bicim"> Bu kısımda h1 biçimi yer alacak</h1>
     <h2 id="bicim">Bu kısımda h2 yer alacak</h2>
     <h2 id="bicim2">Bu kısımda h2 mavi yer alacak</h2>
     <p id="bicim">
           Bu paragraf da biçimlendirilecek.
      </p>
</body>
</html>



Mutlu kodlamalar,
Oğuzhan TAŞ
Ekim, 2016
Bookmark and Share
Dil Değiştir(Change Language)
Kategoriler
Kütüphane Programı
En çok Okunan 18 Makale