Html dili Css dili ile eş zamanlı olarak çalışır. Tek başına bir işe yaramaz. Html sayfamıza Css dilini üç farklı şekilde ekleyebiliriz;
Yerel css ile doğrudan html etiketi içinde sadece o etiketi etkileyecek biçimler verebilirsiniz. Bunu sadece sayfanızda istisna olacak şeyler için kullanabilirsiniz.
Kullanımı:
Html dili Css dili ile eş zamanlı olarak çalışır. Tek başına bir işe yaramaz. Html sayfamıza Css dilini üç farklı şekilde ekleyebiliriz;
Yerel css ile doğrudan html etiketi içinde sadece o etiketi etkileyecek biçimler verebilirsiniz. Bunu sadece sayfanızda istisna olacak şeyler için kullanabilirsiniz.
Kullanımı:
Genel css sadece o sayfadaki etiketleri biçimlendirmek için kullanılır. Diğer sayfalardaki etiketleri etkilemez. Bu yöntem ile sayfadaki tüm ilgili etiketleri aynı anda biçimlendirebilirsiniz. Örnek ile daha iyi anlayacaksınız..
Kullanımı:
Harici css ile html dosyanıza css kodu yazmadan ayrı bir css dosyası ile html dosyanızdaki etiketlerinizi biçimlendirmeniz sağlanır. Genel Css"' den bir farkı yoktur, sadece html kodlarınızı ve css kodlarınızı birbirlerinden ayırmış ve daha düzenli bir hale getirmiş olursunuz. Genelde web siteleri bu yöntem ile biçimlendirilir.
Kullanımı:
Html kodlarımızdaki etiketle rin hepsini nasıl aynı anda düzenleyeceğimizi öğrendik.
Peki mesela bütün paragrafları değilde sadece belirlediğim paragrafları nasıl düzenlerim ?
Bunun için id ve class denen seçicilerden yararlanırız. Bu seçiciler ile etiketlerimizi dilediğimiz şekilde guruplandırabilir ve seçebiliriz. Bunları birer örnekle açıklayalım.
Id seçicisi etiketin bir özelliğidir. Bu seçici sadece bir tek etikete verilebilir. Dikkat edin etiket gurubuna demedim yani sayfadaki tüm <p> etiketlerine bunu veremezsiniz, sadece bir tek <p> etiketine verebilirsiniz. Aşağıdaki örnek ile bir bakışta anlayacaksınız zaten.
Class seçicisi, etiketleri guruplandırmanızı sağlar. Mesela "Meyveler" başlıklı bir sayfanız var. Her meyve için yazdığınız paragraf etiketlerine "meyve" isminde class değeri verirseniz. Tüm meyve paragraflarını guruplandırmış oluruz, böylece de sadece onları istersek biçimlendirebiliriz. Aşağıdaki örneği incelerseniz daha anlayabilirsiniz.
Kullanımı:
Son Olarak..
Html etiketlerinize nasıl Css ile ulaşabileceğinizi bu derste öğrenmiş olduk. Diğer derslerimizde etiketlerimizi nasıl daha iyi biçimlendirebileceğimizi göreceğiz...
Enes KILIÇ
Webmaster
Paylaş: