Css Nasıl Kullanılır?

Css, web sitelerinin tasarımını, yerleşimini ve düzenini ayarlamak için kullanılır.

Css kodları:

  • Dahili (Sayfa içinde)
  • Harici (Dışarıdan çağırılarak)
  • Satır içi (Html etiketi içinde)

olmak üzere 3 farklı yöntemle kullanılmaktadır.

Dahili Olarak Css Kullanımı

Dahili olarak css kullanımı tek bir HTML sayfasının kendine özgü tasarımı varsa kullanılması önerilir. Html kodları içinde kullanılmaktadır. Css kodları <style>...</style> ögesinin içinde <head>… </head> etiketleri arasında kullanılması önerilmektedir. Css kodları sayfanın herhangi bir yerinde kullanılsa bile kodlar düzgün bir şekilde çalışabilmektedir.

Dahili Olarak Css Kullanımı Örneği:

<head>
<style>
body 
{
    background-color: blue;
}
//Arkaplan rengini mavi yapmak için kullanılır
</style>
</head>

Kodu Çalıştır

Harici Olarak Css Kullanımı

Css kodlarının bulunduğu dosyayı dışarıdan çağırdığımızda kullanılan yöntem harici olarak Css kullanma yöntemidir. Harici olarak çağırdığımız Css dosyamızın uzantısı .css olması gerekmektedir. Dosya çağırılma işlemi <head>… </head> etiketleri arasında kullanılması önerilmektedir.

Harici Olarak Css Kullanımı Örneği:

<head>
<link rel="stylesheet" type="text/css" href="arkaplanrengi.css">
</head>

Kodu Çalıştır

Satır İçi Css Kullanımı

Tek bir Html etiketinin kendine özgü tasarımı varsa kullanılır. Satır içi css kullanımında istediğimiz özelliği istediğimiz html etiketine verebiliriz. h1,p,b etiketlerinin içine veya istenilen html etiketlerinin içine stil özelliği eklenebilir.

Html etiketlerine satır içi css uygulamak için style="özellikler bu alana yazılır" şeklinde kullanılır.

Satır İçi Css Kullanımı Örneği:

<body style="background-color:blue" >
</body>

Kodu Çalıştır

***Not: Css kullanarak yapılacak aynı işlemleri harici,dahili ve satır içi css ile yapabilirsiniz.Yukarıdaki kodlarda aynı işlemi arkaplan rengi değiştirmeyi 3 farklı yöntemle(Dahili, Harici ve Satıriçi Css Kullanımı) yaptık. 

Css kodları nasıl kullanılır? adlı dersimiz bitmiştir. Bu dersimizde Css kodları nasıl kullanılır, Css kaç farklı yöntemle kullanılır, dahili css kullanımı, harici css kullanımı ve satır içi css kullanımı hakkında bilgi verdik. Diğer derslerimiz hakkında bilgi almak için css dersleri sayfasından bakabilirsiniz.

Önceki Ders: Css Seçiciler  Sonraki Ders: Css Ölçü Birimleri