Css Temel Bilgileri (Başlangıç)

CSS (Cascading Style Sheets) web sayfalarını stilize etmek için kullanılan bir dil ve HTML ile birlikte web geliştirme sürecinde sıklıkla kullanılır. CSS, belirli bir HTML elementinin (örneğin, bir div, bir yazı tipi, bir resim vb.) görünümünü değiştirebilir ve özelliklerini tanımlayabilir.

İşte CSS’te temel bilgiler:

CSS Syntax

CSS, bir selector (seçici) ve deklarasyon (bildirge) bloğu olmak üzere iki ana parçadan oluşur. Selector, stilini değiştirmek istediğiniz HTML elementlerini seçmenizi sağlar, deklarasyon bloğu ise belirtilen özellikleri ve değerleri içerir.

selector {
  özellik: değer;
}

CSS Özellikleri

CSS’de, bir HTML elementinin birçok özelliğini değiştirebilirsiniz. Özellikler, belirli bir elementin görünümünü değiştirmek için kullanılır. Bazı özellikler şunlardır:

  • background-color
  • color
  • font-family
  • font-size
  • text-align
  • border
  • padding
  • margin

CSS Selectors

Selectorlar, CSS’de bir HTML elementini seçmek için kullanılan bir yol sağlar. Bazı yaygın selectorlar şunlardır:

  • element: belirli bir HTML elementini seçer. Örneğin, h1
  • .class: belirli bir sınıftaki tüm HTML elementlerini seçer. Örneğin, .button
  • #id: belirli bir id’ye sahip bir HTML elementini seçer. Örneğin, #header
  • element, element: birden fazla elementi seçer. Örneğin, div, p

CSS Öncelikleri

Birden fazla CSS stil tanımı varsa, CSS öncelik kurallarına göre, hangi stilin uygulanacağını belirler. Öncelik kuralları şunlardır:

  • Inline stil: HTML elementinin style özelliğinde tanımlanır.
  • ID: #id selector’ı kullanarak tanımlanır.
  • Class: .class selector’ı kullanarak tanımlanır.
  • Element: HTML elementinin kendisi ile tanımlanır.

CSS Box Model

CSS kutu modeli, bir HTML elementinin içeriğinin nasıl sıralandığını ve öğenin dışındaki kenarlıklar, dolgular ve sınırlar gibi diğer bileşenleri nasıl içerdiğini tanımlar. Kutu modeli, bir elementin genişliği ve yüksekliğini belirler ve öğenin tasarımını özelleştirirken dikkate alınması gereken önemli bir konsepttir.

Bu temel bilgiler, CSS öğrenmeye başlamanıza yardımcı olabilir. Daha fazla özellik, selector ve öncelik kurallarını öğrenmek için pratik yapmak önemlidir.

Bunu Paylaş
Pin Share

Bir yanıt yazın

Bizi Sosyal Medyadan Takip edebilirsiniz.