- 13 Ağu 2019
- 144
- 24
- 18
CSS(Stil Şablonları)
Başlangıç için
Rar Şifresi:
Başlangıç için
İçindekiler ................................................................................................ 1
1. CSS’E GİRİŞ ......................................................................................... 7
1.1. CSS’in tanımı ve genel bilgi ............................................................... 7
1.2. CSS’in Avantajları ............................................................................ 7
1.2.1. Görünüm Avantajları ................................................................... 8
1.2.2. Kullanım Kolaylığı ....................................................................... 8
1.2.3. Tasarım Tutarlılığı ....................................................................... 9
1.2.4. Daha az Dosya Boyutları ............................................................. 9
1.2.5. Gelecek Vaat ediyor .................................................................... 9
1.3. CSS Editörleri .................................................................................. 9
1.3.1. Metin Editörleri .......................................................................... 9
1.3.1. CSS Editörleri .......................................................................... 10
1.3.3. HTML ve Web Programlama Editörleri .......................................... 10
1.4. CSS’i Web Dokümanlarına Eklemek .................................................. 11
1.4.1. Kod içinde (In-line) ................................................................... 11
1.4.2. <style> Elemanı Kullanılarak ..................................................... 11
1.4.3. Harici CSS Dosyası Kullanımı ...................................................... 11
1.4.4. @import İle Eklemek ................................................................ 12
1.5. Standart mod, garip mod ve Doctype Kullanımı .................................. 13
1.5.1. Web Sayfalarını Doğrulama "Onaylama" ...................................... 13
1.5.2. Web tarayıcı mod’ları ................................................................ 14
1.5.3. DOCTYPE Geçişleri .................................................................... 14
2. CSS’in Yapısı ...................................................................................... 16
2.1. Seçiciler ve Bildirim Bloğu ............................................................... 16
2.2. Gruplama ..................................................................................... 18
2.3. Değerler ....................................................................................... 20
2.3.1. Anahtar sözcükler ..................................................................... 20
2.3.2. Uzunluk Değerleri ..................................................................... 21
2.3.3. Renk Değerleri ......................................................................... 22
2.3.4. URL Değerleri .......................................................................... 22
2.3.5. Dizgeler(Strings)
2.4. CSS Yorumları ............................................................................... 23
3. Seçiciler ............................................................................................. 25
3.1. Sınıf Seçicisi(Class Selector) ............................................................ 25
3.2. Tekil Seçiciler(Id Selector) .............................................................. 29
3.3. Sınıf(Çoğul) mı? Tekil mi? ............................................................... 30
3.4. (X)HTML Doküman Hiyerarşisini Anlamak .......................................... 32
3.5. Torun Seçicileri (Descendant Selectors) ............................................ 34
3.6. Çocuk Seçicileri(Direct Child Selectors) ............................................. 35
3.7. Bitişik Kardeş Seçiciler(Next Sibling Selector) .................................... 37
3.8. Evrensel Seçiciler(Universal Selector) ............................................... 39
3.9. Özellik Seçicileri(Attribute Selectors) ................................................ 41
3.9.1. Basit Özellik Seçicisi ................................................................. 42
3.9.2. Özellik Değeri Seçicisi ............................................................... 43
3.9.3. Kısmi Özellik Değeri Seçicisi ....................................................... 45
3.9.4. Dikkate Değer Özellik Seçicisi ..................................................... 47
3.10. Sözde(Pseudo)-sınıfları ve Sözde(Pseudo)-elemanları ........................ 49
3.10.1. Sözde Sınıf Seçicileri ............................................................... 50
Sözde Link Sınıfı ................................................................................ 50
Sözde Dinamik Sınıf Seçicileri .............................................................. 52
İlk Çocuk Elemanını seçmek ................................................................ 54
:lang sözde sınıfı ............................................................................... 56
Sözde sınıfları birleştirmek .................................................................. 57
3.10.2. Sözde eleman seçicileri ............................................................ 59
first-letter (ilk harf) ........................................................................... 59
first-line (ilk satır) ............................................................................. 61
before ve after elemanları ................................................................... 62
4. Basamaklı Yapı ve Kalıtsallık ................................................................. 65
4.1. CSS’de Tanımlamalar ve Etkinlikleri(Specificity) ................................. 65
4.2. !important .................................................................................... 70
4.3. Kalıtsallık(Inheritance).................................................................... 71
4.3.1. inherit (kalıtsallık)değeri ............................................................ 73
5. Yazıtipi(Font) Özellikleri ....................................................................... 75
5.1. Renk (color) özelliği ....................................................................... 75
5.2. Yazıtipi ailesi (font-family) .............................................................. 76
5.3. Yazıtipi boyutu (font-size) ............................................................... 78
5.4. Yazıtipi kalınlığı (font-weight) .......................................................... 80
5.5. Yazıtipi biçemi (font-style) .............................................................. 82
5.6. Yazıtipi farklılıkları (font-variant) ...................................................... 84
5.7. Yazıtipi (font) ................................................................................ 85
6. Metin(Text) Özellikleri .......................................................................... 88
6.1. Metin Girintileme (text-indent)......................................................... 88
6.2. Metin hizalama (text-align) ............................................................. 90
6.3. Dikey hizalama (vertical-align) ........................................................ 91
6.4. Satırlar arası yükseklik (line-height) ................................................. 93
6.5. Sözcükler arası mesafe (word-spacing) ............................................. 95
6.6. Harfler arası mesafe (letter-spacing) ................................................ 97
6.7. Harf Büyüklüğü (text-transform) ...................................................... 99
6.8. Satırın altını, üstünü, ortasını çizme ve yanıp sönme (text-decoration) . 101
6.9. Metin gölgelendirme (text-shadow) ................................................. 103
6.10. Boşlukların korunması (white-space) .............................................. 104
6.11. Metin yazma yönü(direction) ........................................................ 105
6.12. Çok yönlülük algoritması (unicode-bidi) özelliği ............................... 107
7. Artalan (Background) Özellikleri ........................................................... 109
7.1. Artalan rengi (background-color) .................................................... 109
7.2. Artalan resmi (background-image ) ................................................. 111
7.4. Artalan resim bağlılığı (background-attachment) ............................... 114
7.5. Artalan resmi konumu (background-position) .................................... 116
7.6. Artalan (background) .................................................................... 118
8. Listeleme Özellikleri ............................................................................ 121
8.1. Liste imleyici tipi (list-style-type ) ................................................... 121
8.2. Liste imleyici resmi (list-style-image) ............................................... 124
8.3. Liste imleyici konumu (list-style-position) ......................................... 125
8.4. Liste biçemi (list-style) .................................................................. 127
9. Kutu Modeli Özellikleri ......................................................................... 129
9.1. Genel Tanımlar ............................................................................. 130
9.2. Kenarlık Çizgisi(Border) Özellikleri ................................................... 131
9.2.1. Kenar çizgisi biçemi (border-style) ............................................. 131
9.2.2. border-top-style, border-right-style, border-bottom-style, border-leftstyle ............................................................................................... 133
9.2.3. Kenar çizgisi genişliği (border-width) .......................................... 134
9.2.4. border-top-width, border-right-width, border-bottom-width, borderleft-width ........................................................................................ 136
9.2.5. Kenar Çizgisi Rengi (border-color) ............................................. 138
9.2.6. border-top-color, border-right-color, border-bottom-color, border-leftcolor ............................................................................................... 139
9.2.7. Kenar Çizgisi (border) .............................................................. 141
9.3. Kenar Dış Boşluğu(Margin) Özellikleri .............................................. 144
9.3.1. Üst Kenar dış boşluğu (margin-top) ........................................... 144
9.3.2. Sağ kenar dış boşluğu (margin-right ) ........................................ 146
9.3.3. Alt kenar dış boşluğu (margin-bottom) ....................................... 147
9.3.4. Sol kenar dış boşluğu (margin-left) ............................................ 149
9.3.5. Kenar dış boşluğu (margin) ....................................................... 151
9.4. Kenar iç boşluğu (Padding) özellikleri ............................................... 155
9.4.1. Üst kenar içi boşluğu(padding-top) ............................................ 155
9.4.2. Sağ kenar içi boşluğu(padding-right ) ......................................... 157
9.4.3. Alt kenar içi boşluğu (padding-bottom) ....................................... 158
9.4.4. Sol kenar içi boşluğu (padding-left) ............................................ 160
9.4.5. Kenar içi boşluğu (padding) ...................................................... 162
9.5. Boyut Tanımlama Özellikleri ........................................................... 165
9.5.1. Genişlik (width)....................................................................... 165
9.5.2. Yükseklik (height ) .................................................................. 166
9.5.3. Asgari genişlik ve yükseklikler (min-width, min-height) ................. 168
9.5.4. Azami genişlik ve yükseklik (max-width, max-height) ................... 170
9.6. Görsel Sonuç Özellikleri ................................................................. 174
9.6.1. Taşma (Overflow) .................................................................... 174
9.6.2. Kırpma (clip) .......................................................................... 182
9.6.3. Görünürlük (visibility) .............................................................. 185
10. Yüzen kutu ve Konumlandırma Özellikleri ............................................. 190
10.1. Yüzen kutu özellikleri ................................................................... 190
10.1.1. float özelliği ......................................................................... 190
10.1.2. clear özeliği .......................................................................... 193
10.2. Konumlandırma Özellikleri ............................................................ 195
10.2.1. Konumlandırma özelliği (position) ............................................ 196
10.2.2. Üst, sağ, alt ve sol (top, right, bottom, left) .............................. 196
Göreceli Konumlandırma(position:relative) ........................................... 197
Mutlak(Absolute) Konumlandırma ....................................................... 197
Sabit Konumlandırma (position:fixed) .................................................. 199
10.3. z-index özelliği ........................................................................... 203
10.4. display özelliği ............................................................................ 209
11. Tablo Özellikleri ................................................................................ 211
11.1. Başlık Konumu Özelliği (table-layout) ............................................. 211
11.2. Tablo planı özelliği (caption-side) .................................................. 214
11.3. Hücre Boşluklarını ayarlama (border-collapse) ................................. 215
11.4. Hücre dışı boşluklarını ayarlama (border-spacing) ............................ 217
11.5. Boş hücre ayarları (empty-cells) .................................................... 219
12. Kullanıcı Arayüzü Özellikleri ............................................................... 222
12.1. Fare imleci özellikleri tanımlama (cursor) ........................................ 222
12.2. Dış hat çizgisi özellikleri(outline) ................................................... 223
12.2.1 Dış hat çizgisi biçemi (outline-style) .......................................... 224
12.2.2. Dış hat çizgisi genişliği (outline-width) ...................................... 225
12.2.3. Dış hat çizgisi rengi (outline-color) ........................................... 225
12.2.4. Dış hat çizgisi (outline) ........................................................... 226
12.3. Sistem yazıtipi ve rengi özellikleri .................................................. 227
Ek – A Tüm CSS özellikleri ...................................................................... 228
Ek – B Kaynakça .................................................................................... 241
Ek – C Sözlük ........................................................................................ 243
İndex Tablosu ....................................................................................... 248
Rar Şifresi:
Bu linki görmek için izniniz yok
Giriş yap veya üye ol.