CSS Nedir?

cssCSS, Cascadind Style Sheet, kelimelerinin kısaltılmasıdır. Anlamı, Basamaklı Biçim Sayfası'dır. Detaya girmeden, hemen örnek uygulamaya geçerek, CSS'nin Web Tasarımında bize sağladığı kolaylıkları görelim. Örnekten sonra hem Div'in ne olduğunu, hem de CSS'nin ne işe yaradığını anlayacağız.

Önce belgelerim klasöründe css adıyla bir klasör açalım. Sonra bu klasörün içinde iki tane html tabanlı web sayfası oluşturalım. Web sayfalarını not defterini kullanarak yapabilirsiniz. Not defterinde yeni bir belge açın ve aşağıdaki kodları yazın.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9" />
<title>CSS Uygulamaları 1</title>
</head>
<body>
<div id="ust-div">Burası Üst Div Alanı</div>
<div id="orta-div">Burası Orta Div Alanı</div>
<div id="alt-div">Burası Alt Div Alanı</div>
</body>
</html>

Bu kodları yazdıktan sonra css-uygulamalari-1.html olarak kaydedin. İnternet tarayıcınız ile kontrol edin. Bunun gibi bir sayfa görüyor olmalısınız. Alt alta üç cümleden oluşan anlamsız bir web sayfası gibi duruyor. Çünkü henüz css dosyasını oluşturmadık. CSS dosyasını oluşturduğumuzda web sayfamız daha anlamlı bir şekle bürünecek.

Not defterinde tekrar yeni bir belge açarak yukarıdaki kodları yazın. Bu kodları yazdıktan sonra css-uygulamalari-2.html olarak kaydedin. Yukarıdaki kodlardan <title>CSS Uygulamaları 1</title> kodunu da <title>CSS Uygulamaları 2</title> olarak değiştirin. İnternet tarayıcınızda kontrol edin. Aynı sayfayı görüyor olmalısınız. Bunun gibi.

Sonraki sayfada CSS belgemizi hazırlayıp web sayfalarımızı şekillendiriyoruz.

right-arrow

Facebookta Paylaş

Valid XHTML 1.0 Transitional