CSS kodları nasıl kullanılır?

03.03.2025 0 görüntülenme

Web tasarım dünyasına adım attıysanız veya sadece meraklıysanız, CSS kodlarının ne kadar önemli olduğunu duymuşsunuzdur. Peki, CSS kodları nasıl kullanılır ve web sitenizin görünümünü nasıl değiştirebilirsiniz? İşte bu rehber, size bu konuda yardımcı olacak.

CSS Nedir ve Neden Kullanılır?

CSS (Cascading Style Sheets), web sayfalarının görsel stilini tanımlamak için kullanılan bir dildir. HTML, web sayfasının içeriğini oluştururken, CSS bu içeriğin nasıl görüneceğini belirler. Renkler, yazı tipleri, düzenler ve daha fazlası CSS ile kontrol edilebilir. CSS kullanmak, web sitenizin daha profesyonel ve kullanıcı dostu görünmesini sağlar.

CSS Kodları Nasıl Yazılır?

CSS kodları genellikle üç farklı şekilde kullanılır:

  • Inline (Satır İçi) CSS: HTML etiketlerinin içine doğrudan stil özellikleri eklenir. Örneğin: <p style="color: blue;">Bu bir paragraftır.</p>
  • Internal (Dahili) CSS: HTML belgesinin <head> bölümünde <style> etiketi içinde CSS kodları yazılır.
  • External (Harici) CSS: Ayrı bir .css dosyası oluşturulur ve bu dosya HTML belgesine bağlanır. Bu yöntem, en yaygın ve önerilen yöntemdir, çünkü kodun daha düzenli ve yönetilebilir olmasını sağlar.

Harici CSS dosyası kullanmak için, HTML belgesinin <head> bölümüne aşağıdaki gibi bir bağlantı eklemeniz gerekir:

<link rel="stylesheet" href="stil.css">

CSS Sözdizimi ve Temel Özellikler

CSS kodları, seçiciler (selectors) ve bildirimler (declarations) içerir. Seçiciler, hangi HTML elementlerinin stilini değiştireceğinizi belirtirken, bildirimler bu elementlerin hangi özelliklerinin nasıl değiştirileceğini tanımlar. Örneğin:

h1 { color: red; font-size: 36px; }

Bu kod, tüm <h1> başlıklarının rengini kırmızıya ve yazı boyutunu 36 piksele ayarlar. İşte sık kullanılan bazı CSS özellikleri:

  • color: Metin rengini belirler.
  • font-size: Yazı boyutunu belirler.
  • background-color: Arka plan rengini belirler.
  • margin: Elementin dış kenar boşluğunu belirler.
  • padding: Elementin iç kenar boşluğunu belirler.

CSS kodları kullanarak web sitenizin görünümünü tamamen değiştirebilirsiniz. Denemekten ve farklı stiller oluşturmaktan çekinmeyin! Unutmayın, pratik yaparak ve örnekleri inceleyerek CSS konusunda daha da ustalaşabilirsiniz.