Css Çeşitleri (Css’i Web Dökümanına Ekleme) Ders 2
Css Çeşitleri (Css’i Web Dökümanına Ekleme) Ders 2
1-Yerel Css: Html kodları içinde body etiketi içinde kullanılır.Sadece eklenen satırı etkiler.
Örnek:
Aşağıdaki kodları notpad’de yazıp index.html olarak kaydediyoruz.
<html> <head><title>css örnekleri</title></head> <h1 style=font-family:verdana;color:red>gorselprogramlama.com</style> </html>
index.html dosyasını çalıştıralım. Sonuç aşağıdadır.
2-Genel Css : Html kodları içinde head etiketi içinde kullanılır.İstenilen satırda kullanılabilir.
Örnek :
Aşağıdaki kodları notpad’de yazıp index.html olarak kaydediyoruz.
<html> <head><title>css örnekleri</title> <style type="text/css"> h3{color:blue} </style></head> <h3>gorselprogramlama.com</h3> </html>
index.html dosyasını çalıştıralım. Sonuç aşağıdadır.
3-Harici Css: Yeni bir css uzantılı dosya oluşturulur.Bütün css kodları buraya yazılır.İstenilen sayfa içerisine çağrılabilir.İki yolu vardır.
1. Yol: link rel komutu kullanılarak çağrılabilir.
Örnek :
Aşağıdaki kodları notpad’de yazıp a.css olarak kaydediyoruz.
h1{color:blue} h2{color:aqua} h3{color:yellow}
Aşağıdaki kodları notpad’de yazıp index.html olarak kaydediyoruz.
<html> <head><title>css örnekleri</title> <link rel="stylesheet" type="text/css" href="a.css"></head> <h1>gorselprogramlama.com</h1> <h2>gorselprogramlama.com</h2> <h3>gorselprogramlama.com</h3> </html>
index.html dosyasını çalıştıralım. Sonuç aşağıdadır.
2.Yol: import komutu kullanılarak çağrılabilir.
Örnek :
Aşağıdaki kodları notpad’de yazıp a.css olarak kaydediyoruz.
h1{color:blue}
h2{color:aqua}
h3{color:yellow}
Aşağıdaki kodları notpad’de yazıp index.html olarak kaydediyoruz.
<html> <head><title>css örnekleri</title> <style type="text/css"> @import "a.css"; </style></head> <h1>gorselprogramlama.com</h1> <h2>gorselprogramlama.com</h2> <h3>gorselprogramlama.com</h3> </html>
index.html dosyasını çalıştıralım. Sonuç aşağıdadır.