1. Reklam


    1. joysro
      ledas
      jungler
      keasro
      zeus
      karantina

Css Nedir?


  1. LosCules

    LosCules Tanınıyorum rank8

    Kayıt:
    4 Kasım 2007
    Mesajlar:
    275
    Beğenilen Mesajlar:
    0
    Ödül Puanları:
    0
    HTML bize metin biçimlendirme alanında çok geniş olanaklar sunar. CSS, uzun yazılışıyla Cascading Style Sheets, veya Türkçesiyle Stil şablonları ise bunu bir adım daha öteye götürür, bize sayfalarımız için global şablonlar hazırlama olanağı verdiği gibi, tek bir harfin stilini; yani renk, font, büyüklük gibi özelliklerini değiştirmek için de kullanılabilir. Bu tekniğin en önemli özelliği kullanımındaki bu esnekliğidir.

    Bir web sayfası içerisinde zaten estetik kuralları gereği yüzlerce renk ve font kullanmayız. Genelde birbiriyle uyumlu birkaç renk ve birkaç font kullanırız ki, bunları her sayfada ayrı ayrı tekrar belirtmek yerine CSS yardımıyla bir sefer tanımlayıp bütün web sayfamızda kullanabiliriz.Bu şekilde güncelleme yaparken de onlarca sayfayı değiştirmekten kurtuluruz.

    CSS kodları HTML kodlarının içine yazılırlar. Türüne göre body veya head bölümlerinde yer alabilirler. Bunların dışında harici CSS dosyaları oluşturulup bunlar gerektiğinde HTML belgesi içerisinde çağırılabilirler.

    Hemen hemen her konuda olduğu gibi CSS konusunda da Microsoft Internet Explorer ve Netscape farklı yorumlar ortaya koyarlar. Bu noktada her iki browserın da aynı/benzer yorumlayacağı kodlar yazmak en uygunudur.
     
  2. Narqotic

    Narqotic Bilgiliyim rank8

    Kayıt:
    22 Nisan 2007
    Mesajlar:
    1.365
    Beğenilen Mesajlar:
    0
    Ödül Puanları:
    0
    Meslek:
    !!!
    Şehir:
    BeN SeNiN CaNıN İçİN ÖmRüMü BiR KiBRiTiN KaBıNDa T
    TeşekkürLEr
     
  3. LosCules

    LosCules Tanınıyorum rank8

    Kayıt:
    4 Kasım 2007
    Mesajlar:
    275
    Beğenilen Mesajlar:
    0
    Ödül Puanları:
    0
    CSS (Cascading Style Sheets ) web tasarımcılarının işini oldukça kolaylaştırmaktadır. CSS HTMLden ayrı yeni bir dil değil, HTMLin önemli bir parçasıdır. CSS ile web sayfasındaki araçların görünümleri genelleştirilir.


    HTML derslerinde style="..." parametresini görmüştük. Bu parametre ile tanımlanan kodun özelliklerini değiştirmiştik. CSS style özelliklerinin tüm sayfa için tanımlanmasıdır. Hem Navigator 4.0 hem de Internet Explorer 4.0 browserlar ve daha gelişmiş olanları CSSyi destekliyor. Fazla uzatmadan konuya girmek daha iyi olur sanırım.

    HTML derslerinde geçen ama üzerinde pek durmadığımız style parametresi üzerinde açıklama yapmam gerekiyor. style parametresi <p>, <div>, <h1>, <a>, <font>, <li> gibi birçok kod için kullanılabilir:

    <p style="text-align:left; font-size:12pt; color:red">...</p>

    Yukarıda HTML derslerinden tanıdığımız, paragraf oluşturan <p> koduna style parametresi atanmıştır. Böylece paragrafın sola yaslanmasını, 12pt (point:nokta ) font büyüklüğündeki harflerden oluşmasını, harflerin renginin kırmızı olmasını sağlıyoruz. style parametresinde birden fazla özellik tanımlanacaksa, örnekte olduğu gibi her özellikler arasına ";" işareti konur.

    Nesne Özelliklerini Genelleştirme
    Sayfa tasarımında CSSden yararlanacaksak style="..." parametresini kullanmamız şart değil,sayfa özelliklerini <style>...</style> kodları arasında da tanımlayabiliriz.<style>...</style> kodları <head>...<head> bölümünde; bir fonksiyonmuşcasına yer alır. (Fonksiyonları JavaScript ve VBScript derslerinde ayrıntılı olarak göreceğiz.

    CSS kullanımını anlatabilmek için aşağıdaki iki örneği inceleyelim. İlk örnekte style="..." parametresi kullanılıyor. İkincisinde ise <style>...</style> kodları kullanılmaktadır.


    Bu uygulamanın aynısını <style> koduyla aşağıdaki şekilde yapabiliriz:
    Şimdi geldik "Naptık?" köşesine. İlk uygulamada <p>, <h1> ve <h4> kodlarını style="..." parametresi ile bu kodlara bazı özellikler atandı. Örneğin <p>...</p> arasındaki metinin sayfanın iki yanına yaslanması, renginin bordo olması ve font büyüklüğünün 12pt olması sağlandı. İkinci uygulamada ise her koda style="..." parametresi atamak yerine, tüm stil özellikleri kodların başında ;<head>...</head> bölümünde, <style>...</style> kodları arasında kod kod tanımlanmıştır. Bu iki uygulama ile aynı sonuca ulaşıyoruz. İlk uygulamanın daha kısa sürdüğü görünüyor, ancak bunun nedeni stil özellikleri tanımlanan kodların birer tane olması. Mesela sayfada <p> kodu çok sayıda yeralsaydı, CSS ile kod sayfası çok daha kısa olacaktı. Bununla birlikte, stil özelliklerini değiştirmek istediğimizde hiç zorlanmayacağız. Ayrıca hata yapma olasılığımız CSS genelleştirmesi ile azalacaktır.

    CSSnin yapısı; uygulamamızdan da görüleceği üzere, şöyledir: KOD {ÖZELLİK: değer}. Eğer koda birden fazla özellik atayacaksak, tıpkı style="..." parametresinde olduğu gibi stil özellikleri arasına ";" işareti konur: KOD {ÖZELLİK1: değer1; ÖZELLİK2: değer2; ÖZELLİK3: değer3} gibi. Stil özelliklerini yanyana yazabileceğiniz gibi, uygulamada olduğu gibi altalta da yazabilirsiniz:

    KOD
    {
    ÖZELLİK1:değer1;
    ÖZELLİK2:değer2;
    ÖZELLİK3:değer3
    }
    Ayrıca aynı stil özelliklerini taşıyacak olan kodları gruplayabilirsiniz:


    KOD1, KOD2, KOD3, KOD4, KOD5
    {
    ÖZELLİK1:değer1;
    ÖZELLİK2:değer2;
    ÖZELLİK3:değer3
    }
    CSSyi Dış Dosya ile Tanımlama
    CSS araçlarını HTML kodlarına atamanın bir başka yolu daha vardır: CSS özelliklerini .css uzantılı bir dosyaya yazmak ve web sayfasından bu dosyayla bağlantı kurmak. Herhangi bir metin editöründe oluşturduğumuz; <style>...</style> kodları arasına yazdığımız CSS özelliklerini içeren, bir dosyayı .css kök ismi ile kaydedin. Web sayfamızın <head>...</head> kısmına aşağıdaki kodlarla .css uzantılı dosyanızla bağlantı kurun; mesela dosyanın ismi diaz.css olsun:

    <link rel="stylesheet"
    type="text/css"
    href="diaz.css">
    Daha önce style parametresi ve style kodları ile yaptığımız AĞIR ROMAN isimli sayfayı, bu sefer yeni öğrendiğimiz dış dosya yöntemiyle yapalım. (Yine aynı sayfayı yapacağız. ) Tabi önce .css isimli dosyayı oluşturacağız. Aşağıdaki sayfayı tarz.css ismiyle kaydettim:
    Bu sayfayı "tarz.css" ismiyle kaydettikten sonra, web sayfasını şöyle oluştururum:
    Özellikle aynı formatta çok fazla sayfa içeren siteler için dış dosya yöntemini kullanmanızı tavsiye ederim. Böylece her sayfa için aynı kodları yazıp durmanız gerekmez. Ayrıca sayfaların formatını değiştirmek istediğinizde ".css" uzantılı dosyanızı değiştirmeniz yeterli olacaktır. CSSnin yapısını böylece tanımış olduk.
     
  4. silkroad77

    silkroad77 Öğreniyorum rank8

    Kayıt:
    30 Kasım 2007
    Mesajlar:
    103
    Beğenilen Mesajlar:
    0
    Ödül Puanları:
    0
    Meslek:
    Öğrenci
    Şehir:
    Hysteria,Alexander,Yalova
    Paylaşım için teşekkürler :lol: