CSS (Cascading Style Sheets), web sayfalarının görünümünü kontrol eden stil dilidir. HTML sayfalarının yapısını tasarımla birleştirerek renk, yazı tipi, hizalama ve animasyon gibi özellikleri tanımlar.
CSS, HTML elemanlarını seçer ve onlara belirlenen stilleri uygular. CSS’in uygulanma yöntemleri şunlardır:
<p style="color:red;">)<style> etiketi içinde tanımlanır ve sadece o sayfada geçerlidir.Seçiciler, hangi HTML elemanına stil uygulanacağını belirtir. İşte temel seçici türleri:
| Seçici Türü | Örnek | Açıklama |
|---|---|---|
| Etiket | p { color: blue; } |
Tüm <p> etiketlerine uygulanır. |
| Sınıf | .buton { background: green; } |
Sadece belirtilen sınıfa sahip elementlere uygulanır. |
| ID | #header { font-size: 20px; } |
Benzersiz bir ID'ye sahip elemente uygulanır. |
| Genel | * { margin: 0; } |
Tüm elementlere uygulanır. |
CSS ile renkleri, yazı tiplerini ve boyutları kolayca değiştirebilirsiniz:
color: red; veya color: #ff0000;font-family: Arial, sans-serif;font-size: 16px;font-weight: bold;CSS kutu modeli, bir öğenin çevresindeki alanları ve boyutlarını tanımlar:
CSS konumlandırma özellikleriyle sayfa üzerinde öğeleri tam istediğiniz yere yerleştirebilirsiniz:
Daha temiz ve sürdürülebilir CSS için ipuçları:
@media sorgularını kullanın.<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<title>CSS Temelleri</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1 class="baslik">Merhaba CSS</h1>
<p class="metin">Bu CSS ile hazırlanmış bir örnek metindir.</p>
</body>
</html>
/* style.css */
.baslik {
color: #4e73df;
text-align: center;
font-size: 2rem;
}
.metin {
font-size: 16px;
color: #333;
text-align: center;
}
Blog Yazılarımız"Yeni Makalelerle İlham Alın"
Flask, hafif bir WSGI web uygulama frameworkudur. Karmaşık uygulamalara ölçeklenebilme özelliğiyle hızlı ve kolay bir başlangıç yapmak için tasarlanmıştır.
Daha Fazla
MongoDB, PostgreSQL - MySQL gibi ilişkisel veritabanlarından farklı olarak NoSQL veritabanı olarak sınıflandırılan bir veritabanıdır.
Daha Fazla
HTML nedir, ne işe yarar? HTML etiketleri, SEO uyumu, erişilebilirlik ve web geliştirmedeki rolünü adım adım öğrenin. 2025 güncel rehber.
Daha FazlaWeb geliştirme, oyun geliştirme, SEO ve veritabanı çözümleri için uzman ekibimizle şimdi tanışın.
© 2024 Mantraxo. Tüm Hakları Saklıdır.
Aug. 1, 2025 
Web & Yazılım Çözümleri
Yakında Aktif
İstanbul, Türkiye
support@mantraxo.com
mantraxo.com