- Katılım
- 8 Şub 2021
- Mesajlar
- 99
- Beğeni
- 69
- Puanları
- 450
Harici Css Dosyası Oluşturma ve Kullanma
Oluşturacağımız stilleri sitemizdeki tüm sayfalarda kullanacaksak, bu stil şablonlarını uzantısı .css olan bir dosyada yazabiliriz.
Bu stil dosyasını istediğimiz web sayfalarına bağlayarak o sayfalar için geçerli olmasını sağlayabiliriz.
Bu sayede sitenin tasarımında bir değişiklik yapmak istediğimizde sadece bu dosyayı düzenleyerek tüm sayfaların değişmesini sağlayabiliriz.
Bir web sayfasına stil dosyası uygulamak için o web sayfasının head kısmına şu kodu eklemelisin.
<link rel=”stylesheet” type=”text/css” href=”dosyaYolu.css” />
Harici stil dosyası içerisinde stillerimiz şu şekilde yazılabilir.
Birden Fazla Stil Dosyası Kullanma
Bir web sayfasına birden fazla stil dosyası da bağlanabilir.
Farklı stil dosyalarında aynı etiketler veya seçiciler tanımlanmış ve aynı özellikler farklı şekillerde biçimlendirilmiş ise en son okunan stil sayfasındaki özellikler geçerli olacaktır.
Bu durum aynı özelliğin hem harici stil dosyasında hem de head kısmında biçimlendirilmesi durumunda da geçerlidir.
Örnek Vereyim ;
Bu durumda h1 etiketi mavi renk olacaktır.
Çünkü en son okunan stil dosyası stil1.css'dir ve o dosyada h1 mavi yapılmıştır.
Yerel stil şablonları en yüksek önceliğe sahiptir. (ÖNEMLİ)
{Alıntıdır}
Oluşturacağımız stilleri sitemizdeki tüm sayfalarda kullanacaksak, bu stil şablonlarını uzantısı .css olan bir dosyada yazabiliriz.
Bu stil dosyasını istediğimiz web sayfalarına bağlayarak o sayfalar için geçerli olmasını sağlayabiliriz.
Bu sayede sitenin tasarımında bir değişiklik yapmak istediğimizde sadece bu dosyayı düzenleyerek tüm sayfaların değişmesini sağlayabiliriz.
Bir web sayfasına stil dosyası uygulamak için o web sayfasının head kısmına şu kodu eklemelisin.
<link rel=”stylesheet” type=”text/css” href=”dosyaYolu.css” />
Harici stil dosyası içerisinde stillerimiz şu şekilde yazılabilir.
CSS:
body {
font-family: Verdana, Geneva, sans-serif;
font-size: 10pt;
color: #000;
}
.onemli{
font-weight: bold;
color: #F00;
text-decoration: underline;
}
#header {
font-size: 48pt;
font-weight: bold;
background-color: #CFF;
}Birden Fazla Stil Dosyası Kullanma
Bir web sayfasına birden fazla stil dosyası da bağlanabilir.
Farklı stil dosyalarında aynı etiketler veya seçiciler tanımlanmış ve aynı özellikler farklı şekillerde biçimlendirilmiş ise en son okunan stil sayfasındaki özellikler geçerli olacaktır.
Bu durum aynı özelliğin hem harici stil dosyasında hem de head kısmında biçimlendirilmesi durumunda da geçerlidir.
Örnek Vereyim ;
CSS:
h1 etiketi için stil1.css dosyasında
h1 { color: blue; }
stil2.css dosyasında ise
h1 { color: red; }
yazılmış olsun
Belgenin head kısmı da şu şekilde olsun
<style type="text/css">
h1 { color: green; }
</style>
<link href="stil2.css" rel="stylesheet" type="text/css" />
<link href="stil1.css" rel="stylesheet" type="text/css" />Çünkü en son okunan stil dosyası stil1.css'dir ve o dosyada h1 mavi yapılmıştır.
Yerel stil şablonları en yüksek önceliğe sahiptir. (ÖNEMLİ)
{Alıntıdır}
Son düzenleme:
