Bu derste bir html sayfası içerisinde CSS özelliklerinin nasıl kullanıldığını öğreneceksiniz.
Kursa 27.99 TL'ye kayıt olmak için TIKLAYINIZ.
CSS Html etiketlerine stil vermek için kullanılır. Görüntüyle alakalı çoğu şey CSS sayesinde yapılır.
Örneğin;
en temel katkısı bunlardır. CSS ile yapılabilecek işlevler oldukça fazladır. Ve zaman içerisinde en çok kullanılan CSS özelliklerini hep beraber tanıyacağız.
Elbetteki CSS özelliklerini verebilmek için dosyaya CSS kullandığımızı belirtmemiz gerekiyor. Ve bunu biz 3 farklı şekilde yapabiliyoruz.
Şimdi bu 3 çağırma şeklinin nasıl yapıldığını anlatacağım;
1-) Direkt etikete style ekleme
<p style="color:green;">Bu kırmızı bir yazıdır.</p>
Burada ne yaptık paragrafın içerisindeki yazıyı kırmızıya çevirdik. Yani yazıya bir style ekledik.
2-) Internal CSS - Dahili CSS
<!DOCTYPE html>
<html lang="en">
<head>
<title>Dahili CSS Ekleme</title>
<style>
p{
color:red;
}
</style>
</head>
<body>
<p>Ben kırmızı bir yazıyım</p>
</body>
</html>
Burada style etiketi içerisinde p etiketini seçip bu etikete direkt bir yazı ekledik. Eee haliyle oluşturmuş olduğunuz tüm paragraf etiketlerinin içerisindeki yazılar kırmızı olacaktır. Bunları özelleştirmenin yolları vardır. Bunu da zamanla öğreneceksiniz.
3-) External CSS - Harici CSS (En çok kullandığımız yöntemdir. Bunun sebebi kodların derli toplu düzenli gözükmesini sağlamaktadır. Style özelliklerini ayrı bir dosyada tutmak en güzelidir.)
style.css dosyasının içerisinde bulunan kodların kullabilmesi head etiketinin içerisine link etiketi ile bu style.css dosyasının dahil ediyoruz. İşte bu style özelliklerini başka bir dosya içerisinden aldığımız için
buna external yani harici CSS diyoruz.
***index.html dosyasının kodları aşağıdadır.
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<p> Kaan Academy nice insanlar Yetiştirmeye Devam Edecektir.</p>
</body>
</html>
***style.css dosyasının içerisinde bulunanlar aşağıdadır.
p{
color:red;
}