CSS Ders 3 (CSS Nasıl Eklenir?)
En çok kullanılan ve kullanılması tavsiye edilen bağlantı şekli Harici CSS dir.
- Yerel CSS
Uygulanan stil özellikleri sadece o uygulanan tag için geçerlidir.
Uygulama işlemi style="" özelliği kullanılarak yapılır.
CSS kodlarını element içinde açacağımız STYLE özelliğine sıralarız.
Örneğin;
<p style="font-family: Tahoma; font-size: 12px;">Bu 12 piksel Tahoma yazı tipi ile yazıldı.</p>
- Genel CSS
HTML sayfamızda HEAD elementlerinin arasında yazılır. Bu da stil özelliklerini sadece o sayfa özel yapar.
<html>
<head>
<title>Sayfa Başlığı</title>
<style type="text/css">
body { background-color:black; color:white; }
p { font-family: Tahoma, Verdana; font-size: 12px; }
</style>
</head>
<body>
<p>Bu 12 piksel Tahoma yazı tipi ile yazıldı.</p>
</body>
</html>
Örneğe baktığımızda <style type="text/css"> elementini HEAD elementi içinde açıp kapatıyor ve içine stillerimizi yazıyoruz. Böylelikle dosyamızda belirttiğimiz stiller dışarıdan bir dosyaya bağlı olmaksızın kullanılabilir olacaklar.
- Harici CSS
Öncelikle bir not defteri ya da CSS düzenleyici program açmalısınız.
CSS Kodlarınızı CSS Kod Yapısı'na uygun olarak yazın ve kaydedin.
HTML Sayfanızı açıp ile arasına aşağıdaki şekilde stil dosyanızın adını belirtin.
<html>
<head>
<title>Sayfa Başlığı</title>
<link href="stil_dosyasi.css" type="text/css" rel="stylesheet"/>
</head>
<body>
<p>Bu 12 piksel Tahoma yazı tipi ile yazıldı.</p>
</body>
</html>
href="DOSYA_ADI" ile belirttiğimiz yerde bizim kaydettiğimiz dosyanın adı yer almalı ve HTML sayfası ile CSS dosyası aynı klasörde bulunmalıdır.
Farklı bir klasörde kullanmak istiyorsak HTML sayfasına göre konumu yazmamız gereklidir.
Dosya adını doğru yazdıysak artık CSS dosyamızı HTML sayfamıza bağladık demektir.
Yani CSS dosyamızdaki stilleri rahatlıkla HTML sayfamızda kullanabiliriz.
İlgili Konular
0
Yorum