IRCForum - IRC ve mIRC Kullanıcıları Topluluğu  
  IRCForum - IRC ve mIRC Kullanıcıları Topluluğu > IRCForum.Gen.TR - Webmaster > Web Uygulamaları > HTML/CSS/JavaScript


CSS'nin Yapısı

HTML/CSS/JavaScript hakkında bilgiler, ipuçları, sorular, sorunlar ve çözümleri.


Kullanıcı Etiket Listesi

Yeni Konu Aç Cevapla
 
Konu Araçları Görünüm Modları
Eskimiş 25-Ocak-2025, 15:37   #1
 
SynaX Kullanıcısının Avatarı

Üye No: 1
Kayıt Tarihi: 26-Aralık-2024
Mesajlar: 858
Konular: 828
Nerden: Bursa
Takımı: Beşiktaş
Meslek:
Aldığı Beğeni: 3
Beğendikleri: 5
@SynaX
Varsayılan CSS'nin Yapısı

CSS Nedir?

CSS (Cascading Style Sheets), HTML ile oluşturulan web sayfalarının görsel tasarımını ve düzenini kontrol etmek için kullanılan bir stil dilidir. CSS, web sayfalarına renk, yazı tipi, boşluklar, boyut ve konum gibi stil özellikleri eklemeye olanak tanır. HTML'in yapısal içeriğini ayrı tutarak, web tasarımcılarının sayfa düzenini ve görünümünü daha kolay yönetmesine yardımcı olur.

CSS Yapısı

CSS'in temel yapısı seçiciler (selectors), özellikler (properties) ve değerler (values) gibi üç ana bileşenden oluşur.

Temel CSS Sözdizimi:
HTML Kodu
seçici {          özellik1: değer1;          özellik2: değer2;          ...}
Örnek:

HTML Kodu
p {      color: blue;      font-size: 16px;}
Bu örnekte:
  • p (seçici): Paragraf elemanlarını hedefler.
  • color (özellik): Yazı rengini belirler.
  • blue (değer): Yazının mavi olmasını sağlar.
  • font-size: 16px özelliği ise paragraf metninin boyutunu 16 piksel yapar.
CSS Bileşenleri:

1. Seçiciler (Selectors)

Seçiciler, hangi HTML elementine stil uygulanacağını belirler.
  • Temel Seçiciler:
    • Element Seçicileri: Belirli bir HTML elemanını hedef alır. (h1, p, div gibi)
    • Sınıf Seçicileri: class özelliği ile tanımlanan elementlere stil uygular. (.kutu)
    • ID Seçicileri: id özelliğine sahip elementleri hedefler. (#baslik)
  • Gelişmiş Seçiciler:
    • Grup Seçicileri: Aynı stilin birden fazla elemente uygulanmasını sağlar. (h1, h2, p)
    • Alt Seçiciler: Belirli bir elemanın altındaki diğer elemanları seçer. (div p)
2. Özellikler (Properties)

HTML elemanının hangi özelliğinin değiştirileceğini belirler. Bazı yaygın CSS özellikleri şunlardır:
  • Renk ve Yazı Tipi:
    • color: Metin rengi
    • font-family: Yazı tipi
    • font-size: Yazı boyutu
  • Düzen (Layout):
    • margin: Dış boşluklar
    • padding: İç boşluklar
    • width ve height: Genişlik ve yükseklik
  • Arkaplan:
    • background-color: Arkaplan rengi
    • background-image: Arkaplan resmi
3. Değerler (Values)

Özelliklere atanan belirli değerlerdir.


Örneğin:


HTML Kodu
color: red;      /* Renk değeri */font-size: 20px; /* Piksel değeri */
CSS Türleri

CSS stilleri sayfalara üç farklı yöntemle eklenebilir:
  • Inline CSS (Satır İçi CSS)
    • Stil doğrudan HTML elementinin içine eklenir.
    HTML Kodu
    <p style="color: blue;">Bu bir mavi paragraf.</p>
  • Internal CSS (Dahili CSS)
    • CSS kuralları <style> etiketi içinde, HTML dosyasının <head> bölümünde tanımlanır.
    HTML Kodu
    <style>    h1 {        color: green;    }</style>
  • External CSS (Harici CSS)
    • Stil kuralları ayrı bir dosyada (.css) tanımlanır ve HTML dosyasına bağlanır.
    HTML Kodu
    <link rel="stylesheet" href="stil.css">
Cascading (Basamaklı) Yapı Nedir?

CSS, "Cascading" yani "basamaklı" adı verilen bir yapıya sahiptir. Bu, bir elemente birden fazla stil kuralı uygulandığında, hangi stilin geçerli olacağını belirleyen bir sistemdir:
  • Öncelik sırası:
    • Inline CSS (En yüksek öncelik)
    • Internal CSS
    • External CSS
    • Tarayıcı varsayılan stilleri

 
Alıntı ile Cevapla
Cevapla

Yer İmleri

Etiketler
css'nin yapısı, cssnin, yapisi


Konuyu Görüntüleyen Aktif Kullanıcılar: 1 (0 üye ve 1 misafir)
 
Konu Araçları
Görünüm Modları

Yayınlama Kuralları
Yeni konu açamazsınız
Cevap gönderemezsiniz
Eklenti ekleyemezsiniz
Mesajlarınızı düzenleyemezsiniz

Kodlama is Açık
İfadeler Açık'dir
[IMG] kodu: Açık
HTML kodu: Kapalı
Trackbacks are Kapalı
Pingbacks are Kapalı
Refbacks are Kapalı