STİL ŞABLONLARI
Öğretmenimiz
dersi geçiyoruz dedi ve bilgisayarlarınıza oturun dedi. Dediklerimi yazın
dedi.Konumuz stil şablonları idi.Stil şablonları sayfalarımız için global
şablonlar hazırlama olanağı verdiği gibi tek bir harfin stilini:yani renk,
font, büyüklük gibi değiştirmek içinmiş.
STİL ŞABLONLARININ KOMUT YAPISI
Bir
stil dokümanı <style type= ’
’text/css’’>…</style> ifadeleri arasına yazılırmış. Stil kısmı HTML
dökümanının <head>…</head>
aralığına tanımlanırmış.
STİL ŞABLONLARININ ÇEŞİTLERİ
Stil şablonları üç çeşittir. Bunlar: Yerel CSS, Genel CSS, Harici CSS miş.
Yerel Stil şablonu:
Yerel stil şablonu HTML belgesinin body kısmına yazılırmış. Sadece bir
kereliğine yazıldığı yerde etkili olurmuş. Öğretmenimiz öyle söylediJ
Genel Stil
Şablonları: HTML belgesinin head
bölümüne yazılıp belgenin tümünü etkilermiş.
Harici Stil
şablonları: Global stil şablonu sitemiz içerisindeki tüm sayfalarda aynı
stil özelliklerini Kullanarak istediğimize ulaşabiliriz.
HTML dosyasının kodlarının arasında geçen <link rel=’’stylesheet’’
type=’’text/css’’href=’’stil. css’’>
Font –Family: Font tipini belirler.
Font-weight: Fontun kalınlık ve inceliğini belirtir.
Ø
Bold:
Fontu kalın yapar.
Ø
Normal:
Fontu normal hale getirir.
Ø
Font-style:
Fontun stilini belirler
Ø
İtalic: Yazının sağa doğru yaslar.
Ø
Color: Yazının rengini belirler.
Text-Transform:
Ø
Lowercase: Yazının tümünü küçültür.
Ø
Uppercase: Yazının tümünü büyültür.
Ø
Capitalize: Yazıyı istediğin şekilde bırakır.
Text-Decoration:
Ø
Underline: Yazının altı çizik olmasını sağlar.
Ø
Overline: Yazının üstünü çizgili olmasını
sağlar.
Ø
Line thrugh: Yazının üzerini çizgili olmasını
sağlar.
Ø
None: Yazının herhangi bir yerine çizgi bırakır.
Text –Align
Ø
Left:Yazının solda olmasını sağlar.
Ø
Center: Yazıyı ortalar.
Ø
Right: Yazıyı sağ yaslar.
Ø
Line height: Yazının normal satırdan çizgi
yüksekliğini belirler.
Ø
Text-ident: Yazının soldan ne kadar boşluk
kalacağını ayarlar.
Seçiciler
Seçiciler bize oluşturduğumuz <h1> , <h2> gibi etiketlerin
mevcut özelliklerini aynı bırakarak onlara yeni özellikler sağlıyormuş. Bunlar Id seçiciler
ve sınıf seçicilerdir.
Ø
Id
selectors ( Id Seçiciler )
Id seçiciler tanımlayıcı adların
önündeki ‘’#’’ işaretinden tanırız. HTML
belgesindeki tanımlayıcı adlara gönderme yaparak herhangi bir HTML etiketine
stil vermek için kullanırız.
Ø
Class Selectors
( Sınıf Seçiciler )
Bu seçiciye sayfamızdaki h1 gibi
etiketlerin tümünü ayrı olmasını istemediğimiz zaman kullanırız. Böylelikle
genel bazı özelliklere koruyarak farklı özellikleri değiştirebiliriz
Hiç yorum yok:
Yorum Gönder