CSS Nedir?
CSS, Basamaklı Stil Sayfaları anlamına gelir. Renkler, düzen ve yazı tipleri dahil olmak üzere Web sayfalarının sunumunu tanımlayan ve böylece web sayfalarımızı kullanıcılara sunulabilir hale getiren dildir. CSS, web için stil sayfaları yapmak üzere tasarlanmıştır. HTML'den bağımsızdır ve herhangi bir XML tabanlı biçimlendirme dili ile kullanılabilir.
CSS Nasıl Kullanılabilir?
CSS, HTML belgelerine 3 şekilde eklenebilir:
1- Satır İçi CSS
- Tek bir HTML öğesine benzersiz bir stil uygulamak için satır içi CSS kullanılır.
- Satır içi CSS style, bir HTML öğesinin özniteliğini kullanır.
Aşağıdaki örnek, <h1> öğenin metin rengini mavi ve öğenin metin rengini <p> kırmızı olarak ayarlar :
<h1 style="color:blue;">Mavi Başlık</h1>
<p style="color:red;">Kırmızı Paragraf</p>
2- Dahili CSS
- Tek bir HTML sayfası için bir stil tanımlamak için dahili bir CSS kullanılır.
- Bir <head> HTML sayfasının bölümünde, bir <style> öğe içinde dahili bir CSS tanımlanır.
Aşağıdaki örnek, TÜM <h1> öğelerin (o sayfadaki) metin rengini beyaz'a ve TÜM <p> öğelerin metin rengini siyah'a ayarlar. Ayrıca, sayfa "Kırmızı" arka plan rengiyle görüntülenecektir :
<!DOCTYPE html>
<html>
<head>
<style>
body {background-color: red;}
h1 {color: white;}
p {color: dark;}
</style>
</head>
<body>
<h1>Merhaba Dünya Başlık</h1>
<p>Merhaba Dünya Paragraf</p>
</body>
</html>
3-Harici CSS
- Birçok HTML sayfasının stilini tanımlamak için harici bir stil sayfası kullanılır.
Harici bir stil sayfası kullanmak için <head>, her HTML sayfasının bölümüne bir bağlantı ekleyin :
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Merhaba Dünya Başlık</h1>
<p>Merhaba Dünya Paragraf</p>
</body>
</html>
- Harici stil sayfası herhangi bir metin düzenleyicide yazılabilir. Dosya herhangi bir HTML kodu içermemeli ve bir .css uzantısıyla kaydedilmelidir.
"styles.css" dosyası şöyle görünür :
body {background-color: pink;}
h1 {color: white;}
p {color: dark;}