CSS dosyasını hazırlamak için ekstra programlama ihtiyaç duymamaktayız. Yani CSS dosyanızı herhangi bir metin editörü ile (Notepad, Notepad2, Notepad+, EditPlus) hazırlayabilirsiniz.
Browserınızın CSS dosyasını tanıması için tek yapmanız gereken hazırladığınız CSS dosyasının uzantısının .css olması gerekmektedir. Örnek verecek olursak ; kaydedeceğimiz dosya arman.css şeklinde kaydedilmelidir.
Bir CSS dosyası içerisinde tanımlamalar küme parantezi ile { başlar ve küme parantezi kapatma ile } kapanır. Örnek;

Body { text-align:left; }
Yukarıda örnekte gördüğünüz gibi Body tagı için tanımlayacağımız stilleri küme parantezi içerisine aldık. Küme parantezi içerisinde yapacağımız tanımlamaların sıralamasınıda
ÖZELLİK: (ikinokta üstüste) DEĞER ; (noktalı virgül)
Şeklinde yazabiliyoruz. Yukarıda belirttiğimiz TANIM kısmı vereceğimiz özellik (yazı, renk, arkaplan v.b), DEĞER olarak tanımladığımız yer ise belirttiğimiz özellik için alacağı değerdir. (Renk kodu, arka plana dresi, sağ, sol v.b)
Bir tag için belirteceğimiz özellik birden fazla ise her özelliği belirttikten sonra ; (noktalı virgül) kullanmak zorundasınız. Bu sayede kullanılan tarayıcı o özelliğin bittiğini ve tag için ikinci özelliğin olduğunu anlayıp onuda işleme koyacaktır.
NOT : CSS’in de kendine özgü bir yazım stili bulunmaktadır. Bir çok programlama dilinde olduğu gibi CSS’de bu yazım kurallarına uygun yazılmalıdır. CSS Validation ile ilgili kısımlara ilerde değineceğiz)
Vereceğimiz stil değerleri için bazı ön tanımlamaları bilmek gerekmektedir.
(.), (#) ve ().
. (nokta) tag içinde vereceğimiz stilin CLASS etiketine sahip olduğunu belirtir.
HTML kodlarımız içerisinde <span class=”STYLE”>Merhaba</span> şeklinde class etiketinde yaptığımız STYLE tanımlamasının CSS kodları içerisindeki karşılığı .STYLE şeklindedir. Örnek verecek olursak;
.STYLE { color:#ff6600; letter-spacing:1px; }
# (diyez) tag içinde vereğimiz stilin ID etiketine sahip olduğunu belirtir. HTML kodlarımız içerisinde <span id=”STYLE”>Merhaba</span> şeklinde id etiketine yaptığımız STYLE tanımlamasının CSS kodları içerisindeki karşılığı #STYLE şeklindedir. Örnek verecek olursak
#STYLE { color:#ff6600; letter-spacing:1px; }
Bu noktada unutmamanız gereken bir bölüm var. Bu da id ile class arasındaki farktır. Aynı class etiketini 1’den çok taga tanımlayabilirken , ID etiketini o sayfa içerisinde sadece bir tane taga tanımlayabilirsiniz. Birden fazla tag a id tanımlaması sorunsuz çalışacağı halde ilerde bahsedeceğimiz gibi CSS Validation olayında geçmeyecek ve sayfamız onay alamayacaktır.
Birde nokta veya diyez kullanmadan yapılabilen CSS tanımlamaları mevcuttur. Bunlar direkt tagın adını belirtmek koşulu ile kullanılır ve o sayfa içerisindeki o taga sahip heryeri etkilerler.
Body , a , img, input bunlardan bazılarıdır. Örnek verecek olursak
a { color:#ff6666; text-decoration:none; font-weight:bold; }
Bu kodu kullandığımız zaman hiç bir class veya id vermediğimiz a (bağlantı) taglarının hepsinin rengi kırmızı altı çizgisiz ve kalın olacaklardır.