CSS NEDİR?
CSS (Cascading Style Sheets)
Css internet sayfalarının görünümünü değiştiren bir tanım dosyasıdır. CSS kendine has kuralları olan bir tanım dilidir denilebilir. CSS Sayfa içersindeki her bir elemana ait farklı özellik atamayı sağlar
Css Özellikleri:
1) Html sayfasındaki nesnelerin görüntüsünü belirler.
2) Html 4.0 sürümü ile stil dosyaları geliştirilmiştir.
3) CSS ayrı bir dosyada *.css uzantısı ile saklanabilir. Bu işlem sayfanın daha hızlı açılmasını sağlar.
4) Elemanlar üzerinde style="" parametresi ile özel kısa tanımlar yapılabilir.
1 - Doctype Nedir?
Doctype HTML - XHTML doküman tipini belirler. Html kodlama yaparken DOCTYPE bildirimi tarayıcının yani browserin tarama metodunu belirler. Bir dökümanda DOCTYPE tanımı yapılırsa bu sayfa belirli standartlara uygundur denir. Eğer doğru kullanılmazsa veya hiç kullanılmazsa web tarayıcıları tarafından sitemiz doğru okunmayacağı gibi kodlamaları da yanlış yapmış oluruz. Bunun için Doctype kullanımı önemlidir.
Bir çok HTML ediötürü DOCTYPE taınımını otomatik ekler.
Bir çok HTML ediötürü DOCTYPE taınımını otomatik ekler.
2 - <html> Nedir?
HTML (Hyper Text Markup Language) internet üzerinde web sayfası oluşturmak için kullanılan bir betik dilidir. HTML dosyalarının aktarımı için HTTP (Hyper Text Transfer Protocol) kullanılır. HTML dosyaları sunucu bilgisayarın sabit diskinde .html ya da .htm uzantısı ile saklanır. Yazdığımız html dosyaları düz yazı dosyalarından başka bir şey değildir. Yani yazdığımız html dosyalarını bir C ya da Pascal programında olduğu gibi bir derleyici ile derlememize gerek yoktur. Bir siteye girdiğimiz zaman bize görüntülenen ilk sayfa index.html, index.htm, index.asp, index.php ya da default.htm dosyalarından birisidir. index.* dosyaları UNIX ve türevi sunucu sistemler, default.htm dosyasıda WinNT ya da türevi sistemler için giriş sayfası olur. Yukarıda saydıklarımın dışında uzantısı değişik birçok biçemdeki sayfalar da sunucu sistemin ayarları değiştirilerek giriş sayfası yapılabilir.
Web istemcimizin adres satırına http://www.belgeler.org gibi bir ifade yazarsak sunucu sistem bize, o adresin www kök dizinindeki index.html (ya da hangi giriş sayfası tanımlı ise) dosyasını görüntüleyecektir.
3- <head> Nedir?
Bu etiketlerle Sitemizin tanımlamarını sağlarız, mesela sitemizin açıklama yazısını, tanımla kelimelerini, sitemizi kimin yaptığını, dışarıdan kullandığı stil (CSS) dosyalarını gösteririz, kullandığımız diğer yardımcı dilleri bu alanda sitemizin içerisine çağırırız,
Kısacası, Sitemizin baştan aşağı tanımlamasını, bu etiketin çerçevesi içerisinde yaparız.
Kısacası, Sitemizin baştan aşağı tanımlamasını, bu etiketin çerçevesi içerisinde yaparız.
4- <link> Nedir?
Dökümana dışardan bir kaynak bağlar.
5- <div> Nedir?
Dökümanda bir bölümü temsil eder.
6- <span> Nedir?
Dökümanda bir bölümü gösterir.
7- <h1> Nedir?
<h1> ile <h6> arası Başlık yazısı belirler.
8- <ul> Nedir?
Düzensiz liste
9- <li> Nedir?
Liste elemanı
10- <a> Nedir?
Link belirtir
11- <strong> Nedir?
Kalın yazı.
12- <label> Nedir?
Form için metin etiketleri.
13- <form> Nedir?
Bilgi yayıt formu.
14- <input> Nedir?
Form için bilgi alanı,
15- <textarea> Nedir?
Form için uzun yazı alanı.
16- <b> Nedir?
Koyu harfli yazı.
17- <p> Nedir?
Paragraf başı
18- <footer> Nedir?
İçeriğin yayınlandığı alana yazı alanı (Main), genelde yazı alanının sağ ya da sol kısımda bazen ise her iki alanda yer alan sütunlara sidebar, ve alt kısma ise footer denir.
19- <article> Nedir?
Makale, deneme tarzı yazıları kapsar.
20- <aside> Nedir?
Ana içerikte ayrı yazılan kısımdır.
21- background Özelliği Nedir?
Sayfamızdaki herhangi bir objeye arka plan belirlemek için background-image veya background-color gibi kodları kullanıyoruz.
22- overflow Özelliği Nedir?
Belitilen yükseklik doğrultusunda yazının taşmamasını sağlar.
23- border Özelliği Nedir?
Bir HTML elementinin kenarlarınaçizgi çekerken kullanılır.
24- float Özelliği Nedir?
CSS Float özelliği ile birlikte, bir elemanı diğerlerinden bağımsız olarak sağ ya da solda gösterip, elemanın gerisinde kalan alanları (aşağı ya da yukarı gibi) boşluk olarak değerlendirip oaralarıda kullanabileceğimiz sayfalar yapabiliriz.
25- padding Özelliği Nedir?
İçeriğin elementin sınırlarına olan uzaklığını belirlemek için kullanılır.Örneğin "padding:4px;" şeklindeki bir deklerasyon içeriğin sınırlara (alt,üst,sağ ve sol) olan uzaklığının 4 pixel olacağını söyler.
26- margin Özelliği Nedir?
Elementin komşu elementlere olan uzaklığını belirtmek için kullanılır.Örneğin "margin:4px;" şeklindeki bir deklerasyon elementin komşularının sınırlarına (alt,üst,sağ ve sol) olan uzaklığının 4 pixel olacağını söyler. Aşağıdaki şekilde padding ve margin seçeneğini gösterir.
27- width Özelliği Nedir?
Bu özellikle seçili elementin genişlik değeri düzenlenir.
28- height Özelliği Nedir?
Bu özellikle seçili elementin yükseklik değeri düzenlenir.
29- display Özelliği Nedir?
display:inline-block özelliği hibrit bir özelliktir. Bir yanı satır içi davranırken bir yanı blok davranır.
display:inline-block tanımı yapılmış elemanlar satır için akış içinde satır içi eleman gibi davranırken, elemente genişlik, yükseklik ve dikey margin değerleri tanımlanırsa satır içinde blok-level özelliğine bürünür.
display:inline-block elementler çevresindeki elementlere ve satır içi kutu içeriklerine göre farklı davranışlar gösterir.
30- list- style Özelliği Nedir?
Liste öğe belirticileri list-style-type özelliğini kullanarak değiştirilebilir.
31- color Özelliği Nedir?
Yazının rengini belirler.
32- font- size Özelliği Nedir?
Sayfada bulunan bir yazının punto ayarı burada yapılır.
33-font- weight Özelliği Nedir?
Yazının kalınlığı belirlenir.
34- text- decoration Özelliği Nedir?
Metinlere özel işaret vermeyi sağlar.
Dökümana dışardan bir kaynak bağlar.
5- <div> Nedir?
Dökümanda bir bölümü temsil eder.
6- <span> Nedir?
Dökümanda bir bölümü gösterir.
7- <h1> Nedir?
<h1> ile <h6> arası Başlık yazısı belirler.
8- <ul> Nedir?
Düzensiz liste
9- <li> Nedir?
Liste elemanı
10- <a> Nedir?
Link belirtir
11- <strong> Nedir?
Kalın yazı.
12- <label> Nedir?
Form için metin etiketleri.
13- <form> Nedir?
Bilgi yayıt formu.
14- <input> Nedir?
Form için bilgi alanı,
15- <textarea> Nedir?
Form için uzun yazı alanı.
16- <b> Nedir?
Koyu harfli yazı.
17- <p> Nedir?
Paragraf başı
18- <footer> Nedir?
İçeriğin yayınlandığı alana yazı alanı (Main), genelde yazı alanının sağ ya da sol kısımda bazen ise her iki alanda yer alan sütunlara sidebar, ve alt kısma ise footer denir.
19- <article> Nedir?
Makale, deneme tarzı yazıları kapsar.
20- <aside> Nedir?
Ana içerikte ayrı yazılan kısımdır.
21- background Özelliği Nedir?
Sayfamızdaki herhangi bir objeye arka plan belirlemek için background-image veya background-color gibi kodları kullanıyoruz.
22- overflow Özelliği Nedir?
Belitilen yükseklik doğrultusunda yazının taşmamasını sağlar.
23- border Özelliği Nedir?
Bir HTML elementinin kenarlarınaçizgi çekerken kullanılır.
24- float Özelliği Nedir?
CSS Float özelliği ile birlikte, bir elemanı diğerlerinden bağımsız olarak sağ ya da solda gösterip, elemanın gerisinde kalan alanları (aşağı ya da yukarı gibi) boşluk olarak değerlendirip oaralarıda kullanabileceğimiz sayfalar yapabiliriz.
25- padding Özelliği Nedir?
İçeriğin elementin sınırlarına olan uzaklığını belirlemek için kullanılır.Örneğin "padding:4px;" şeklindeki bir deklerasyon içeriğin sınırlara (alt,üst,sağ ve sol) olan uzaklığının 4 pixel olacağını söyler.
26- margin Özelliği Nedir?
Elementin komşu elementlere olan uzaklığını belirtmek için kullanılır.Örneğin "margin:4px;" şeklindeki bir deklerasyon elementin komşularının sınırlarına (alt,üst,sağ ve sol) olan uzaklığının 4 pixel olacağını söyler. Aşağıdaki şekilde padding ve margin seçeneğini gösterir.
27- width Özelliği Nedir?
Bu özellikle seçili elementin genişlik değeri düzenlenir.
28- height Özelliği Nedir?
Bu özellikle seçili elementin yükseklik değeri düzenlenir.
29- display Özelliği Nedir?
display:inline-block özelliği hibrit bir özelliktir. Bir yanı satır içi davranırken bir yanı blok davranır.
display:inline-block tanımı yapılmış elemanlar satır için akış içinde satır içi eleman gibi davranırken, elemente genişlik, yükseklik ve dikey margin değerleri tanımlanırsa satır içinde blok-level özelliğine bürünür.
display:inline-block elementler çevresindeki elementlere ve satır içi kutu içeriklerine göre farklı davranışlar gösterir.
30- list- style Özelliği Nedir?
Liste öğe belirticileri list-style-type özelliğini kullanarak değiştirilebilir.
31- color Özelliği Nedir?
Yazının rengini belirler.
32- font- size Özelliği Nedir?
Sayfada bulunan bir yazının punto ayarı burada yapılır.
33-font- weight Özelliği Nedir?
Yazının kalınlığı belirlenir.
34- text- decoration Özelliği Nedir?
Metinlere özel işaret vermeyi sağlar.
Hiç yorum yok:
Yorum Gönder