Menü ve Reklam Alanı
Sayfayı Paylaş

THB - Ücretsiz Hizmetler

cssd3

Ders 3

CSS’yi web dokümanlarına eklemek

CSS’yi web dokumanlarına eklemenin 4 yolu bulunmaktadır:

1 Kod içerisine eklemek

CSS kodumuzu <div ile başlayan katmanımızın içine yazarak <div></div> katmanları içerisindeki şeyi CSS ile renklendirmiş oluruz.

Ör:

<div style="color:#020202">Deneme Yazısı</div>

Burada css kodumuzu eklemedeki en önemli faktör <div kodumuzun devamıza style="color:#020202" diye devam eden bir stil kodu (yani CSS kodu) eklememizdendir…

2 <style></style> elemanlarını kullanarak CSS kodunu eklemek

Bunu yaparken head kısmına (Bedava-Sitem kullanıcılarında Tasarım Üzeri) oluşturduğumuz CSS kodunu <style> </style> taglarının arasına yapıştırdıktan sonra ekleyerek gerçekleşmektedir.

Ör (Ücretli site kullanıcıları için):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"

/>

<title>CSS’yi web’e aktarma</title>

Kısmı ile

</head> kısmının arasına

<style type="text/css">

div{

color:#020202;

}

</style> <style> </style> tagları arasında ki kodlar yapıştırıldıktan sonra eklenir..

Ör (Bedava-Sitem kullanıcıları için):

Tasarım Ayarları

Gelişmiş Ayarlar

Tasarımın Üzerindeki Yazı kısmına CSS kodumuz yapıştırılılalarak eklenir…

Kod:

<style type="text/css">

div{

color:#020202;

}

</style>

3 CSS dosyası kullanılarak ekleme yapma

Bu işlemi yaparken ilk önce bir CSS editöründen CSS kodumuzu oluşturduktan sonra oluşturduğumuz dosyayı .css olarak kaydedelim. Sonra dosyayı upload edelim. Upload ettikten sonra değişmeyecek olan css dosya ekleme elemanına URL adresimizi yapıştıralım.

Bizim kullanacağımız dosya adı style.css olsun…

CSS dosyası ekleme elemanı:

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

URL adresimizi style.css kısmına yapıştıralım.

Daha sonra head tagı arasına (Bedava-Sitem’de Tasarım Üzerindeki Yazı) kısmına ekleyelim…

Bu yolu kullanmanın avantajı misal bir dosyayı indirdiğinizde bir daha indirirseniz o dosyayı daha hızlı inecektir buda aynı mantık bir kullanıcı CSS dosyasını  Ana sayfanızda bir kere yükleyecek sonra diğer sayfalara ana sayfanızdan daha hızlı erişim sağlayacak…

2 @import ile CSS dosyası eklemek

Bu ekleme yöntemi 3. yönteme benzer bir yöntemdir. Sadece link rel ile başlayan elemanımızı değiştiriyoruz..

Ör:

@import "style.css";

Kullandığımız dosya aynı dosya sadece elemanımızı değiştirerek head tagı arasına (Bedava-Sitem’de Tasarım Üzerindeki Yazı) kısmına ekleyelim…

Bugün 22 ziyaretçi (477 klik) sitemizi ziyaret etti.

Copyright 2012. THB. Tüm hakları saklıdır. Tasarımlayan: Oğuzhan Acımaz.
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol