Sitene Menu ile Css Nedir? Ekle

Sitene Css Nedir?

Sitemizde En Yakın Zamanda Yarışmalar Düzenlenecektir... 

  Tabiki --> www.Yerelkod.tr.gg
           

Css nedir?

CSS Nedir? Cascading Style Sheets

Css’in açılımı ile söze başlayalım. Cascading Style Sheets. Biz kısaca konularımız dahilinde Stil Şablon olarak bahsedeceğiz. Gelelim Stil Şablonun varoluş amacına. Sizinde bildiğiniz üzere Html yazım şekli olarak etiket türünde bir yazım dili. Bu yüzden pek fazla özelliklere sahip değil. Bu sahip olamadığı özellikler nedeniyle sayfanın dizaynında bize tam esneklik veremiyor. Css bu amaçla üretilmiş bir dil. Kullanım kolaylığı ve kullanışlılığı ile Html’e eklenmesinden itibaren çoğu web tasarımcısının gözdesi oldu. Çünkü her türlü sayfa dizaynını bize bırakarak müthiş bir esneklik sağlıyor. Ayrıca ileriki konularımızda bahsedeceğimiz üzere bağlantılı stil şablonlar aracılığı ile de birden çok sayfaya etkiyebiliyor. Bu da bize sitenin görünümün değiştirmek istediğimizde elimizdeki onlarca belki de yüzlerce sayfanın kodlarını değiştirmeden sadece css dosyasının değiştirerek bu imkanı sağlıyor.

Stil Şablon’un tarayıcılara eklenmesinden sonra iki versiyonu çıktı. Bunlar Css 1 ve Css 2. Ayrıca bazı konularda MSIE (Internet Explorer) ve NN (Netscape Navigator) tarayıcıları aynı kodları kabul etmiyorlar. Biz derslerimizde her iki tarayıcıda da etkin olan veya etkin olmayıp dizaynı bozmayan (A:hover gibi) Stil Şablon özelliklerini göreceğiz. Şimdi derslerin içeriğinde neler var onları görelim :

1. Stil Şablon çeşitleri :
Css’in en çok beğenilen yönü istendiğinde sadece bir öğeye etkimesi, istendiğinde tüm sayfaya etkimesi, istendiğinde site içindeki tüm html dosyalarına etkimesidir. Bunlar kısaca Stil Şablonun kullanım çeşitleridir.

2. Html etiketleri ile Css :
Bu dersimizde Html’deki font,background gibi çeşitli özelliklerin Stil Şablon tarafından nasıl belirlenebileceğini göreceğiz.

3. Seçiciler (Selectors) :
Kimi zaman Html etiketlerinden fontu hepimiz kullanırız. Örneğin bir sayfa içerisinde font etiketine birden çok görünüm eklemek isteriz. Bu durumda seçiciler imdadımıza yetişir. Bu dersimizde de seçicilerin nasıl kullanıldığını ve yazım kurallarını öğrenceğiz.

4. Genel kullanım şekilleri :
Bu dersimizde ise A (link) etiketinin çeşitli kullanım biçimleri ile birlikte bir Stil Şablonun nasıl kullanırsak işimize daha fazla yarayacağını göreceğiz. Siz buradaki kullanım tarzına göre Css’i kullanırken kendinize nasıl bir yön izleyeceğinize karar vereceksiniz.

Kaynak: WebMasTer...

.........................................

Css ile tekrarlanmayan arka plan resmi yapmak için öncelikle arka plana bir resim atamak gerekir. Bunu background-image : url(resmim); kodu ile yaparız.
Daha sonra bu resmin tekrarlanmasını önlemek için background-repeat:no-repeat komutunu vermek gerekir.
En son olarak resmi ortalamak için background-position : center komutunu vereceğiz

Şu kodda olduğu gibi :

BODY
{
 BACKGROUND-IMAGE : URL(./bayrak.gif);
 BACKGROUND-REPEAT: NO-REPEAT;
 BACKGROUND-POSITION : CENTER;
}

.......................



 



-----------------


<p>
<table width="490" bordercolor="#000000" border="1">
    <tbody>
        <tr>
            <td width="210"><center><font size="4" face="palatino linotype">Sitene Css Nedir?</font><br />
            <br />
            <script language="JavaScript" type="text/javascript">
                    /* Kayan Haber için gerekli olan functions */
                    function yukarikos() {
                    kaykos.direction="up";
                    }
                    function asagikos() {
                    kaykos.direction="down";
                    }
                    /*////////////////////////////////*/                                                           
</script><marquee onmouseover="kaykos.scrollAmount=0" onmouseout="kaykos.scrollAmount=2" scrolldelay="50" scrollamount="2" width="200" height="150" direction="down" id="kaykos" style="border: 0px none ;"><center><strong><strong><strong>Sitemizde En Yakın Zamanda Yarışmalar D&uuml;zenlenecektir...&nbsp;<hr width="200" />
            </strong></strong></strong></center>
            <p>&nbsp;&nbsp;Tabiki --&gt;&nbsp;<a href="http://www.Yerelkod.tr.gg">www.Yerelkod.tr.gg</a><br />
            <span>&nbsp;</span><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span></p>
            </marquee><center><img border="0" src="http://afyon.meb.gov.tr/images/yukariArrow.gif" onmouseover="yukarikos();" alt="" /> <img border="0" src="http://afyon.meb.gov.tr/images/asagiArrow.gif" onmouseover="asagikos();" alt="" /> </center></center></td>
            <td width="270"><center>
            <div style="padding: 4px; overflow: auto; width: 265px; height: 210px;">
            <h1>Css nedir?</h1>
            <p><font size="2" face="Verdana"><strong>CSS Nedir?</strong> Cascading Style Sheets<br />
            <br />
            Css&rsquo;in a&ccedil;ılımı ile s&ouml;ze başlayalım. Cascading Style Sheets. Biz kısaca konularımız dahilinde Stil Şablon olarak bahsedeceğiz. Gelelim Stil Şablonun varoluş amacına. Sizinde bildiğiniz &uuml;zere Html yazım şekli olarak etiket t&uuml;r&uuml;nde bir yazım dili. Bu y&uuml;zden pek fazla &ouml;zelliklere sahip değil. Bu sahip olamadığı &ouml;zellikler nedeniyle sayfanın dizaynında bize tam esneklik veremiyor. Css bu ama&ccedil;la &uuml;retilmiş bir dil. Kullanım kolaylığı ve kullanışlılığı ile Html&rsquo;e eklenmesinden itibaren &ccedil;oğu web tasarımcısının g&ouml;zdesi oldu. &Ccedil;&uuml;nk&uuml; her t&uuml;rl&uuml; sayfa dizaynını bize bırakarak m&uuml;thiş bir esneklik sağlıyor. Ayrıca ileriki konularımızda bahsedeceğimiz &uuml;zere bağlantılı stil şablonlar aracılığı ile de birden &ccedil;ok sayfaya etkiyebiliyor. Bu da bize sitenin g&ouml;r&uuml;n&uuml;m&uuml;n değiştirmek istediğimizde elimizdeki onlarca belki de y&uuml;zlerce sayfanın kodlarını değiştirmeden sadece css dosyasının değiştirerek bu imkanı sağlıyor. <br />
            <br />
            Stil Şablon&rsquo;un tarayıcılara eklenmesinden sonra iki versiyonu &ccedil;ıktı. Bunlar Css 1 ve Css 2. Ayrıca bazı konularda MSIE (Internet Explorer) ve NN (Netscape Navigator) tarayıcıları aynı kodları kabul etmiyorlar. Biz derslerimizde her iki tarayıcıda da etkin olan veya etkin olmayıp dizaynı bozmayan (A:hover gibi) Stil Şablon &ouml;zelliklerini g&ouml;receğiz. Şimdi derslerin i&ccedil;eriğinde neler var onları g&ouml;relim : <br />
            <br />
            1. Stil Şablon &ccedil;eşitleri : <br />
            Css&rsquo;in en &ccedil;ok beğenilen y&ouml;n&uuml; istendiğinde sadece bir &ouml;ğeye etkimesi, istendiğinde t&uuml;m sayfaya etkimesi, istendiğinde site i&ccedil;indeki t&uuml;m html dosyalarına etkimesidir. Bunlar kısaca Stil Şablonun kullanım &ccedil;eşitleridir. <br />
            <br />
            2. Html etiketleri ile Css : <br />
            Bu dersimizde Html&rsquo;deki font,background gibi &ccedil;eşitli &ouml;zelliklerin Stil Şablon tarafından nasıl belirlenebileceğini g&ouml;receğiz. <br />
            <br />
            3. Se&ccedil;iciler (Selectors) : <br />
            Kimi zaman Html etiketlerinden fontu hepimiz kullanırız. &Ouml;rneğin bir sayfa i&ccedil;erisinde font etiketine birden &ccedil;ok g&ouml;r&uuml;n&uuml;m eklemek isteriz. Bu durumda se&ccedil;iciler imdadımıza yetişir. Bu dersimizde de se&ccedil;icilerin nasıl kullanıldığını ve yazım kurallarını &ouml;ğrenceğiz. <br />
            <br />
            4. Genel kullanım şekilleri : <br />
            Bu dersimizde ise A (link) etiketinin &ccedil;eşitli kullanım bi&ccedil;imleri ile birlikte bir Stil Şablonun nasıl kullanırsak işimize daha fazla yarayacağını g&ouml;receğiz. Siz buradaki kullanım tarzına g&ouml;re Css&rsquo;i kullanırken kendinize nasıl bir y&ouml;n izleyeceğinize karar vereceksiniz. <br />
            <br />
            Kaynak: WebMasTer...</font></p>
            <p><font size="2" face="Verdana">.........................................</font></p>
            <p><font size="2" face="Verdana">Css ile tekrarlanmayan arka plan resmi yapmak i&ccedil;in &ouml;ncelikle arka plana bir resim atamak gerekir. Bunu background-image : url(resmim); kodu ile yaparız.<br />
            Daha sonra bu resmin tekrarlanmasını &ouml;nlemek i&ccedil;in background-repeat:no-repeat komutunu vermek gerekir.<br />
            En son olarak resmi ortalamak i&ccedil;in background-position : center komutunu vereceğiz</font></p>
            <p><font size="2" face="Verdana">Şu kodda olduğu gibi : </font></p>
            <p><font size="2" face="Verdana">BODY<br />
            {<br />
            &nbsp;BACKGROUND-IMAGE : URL(./bayrak.gif);<br />
            &nbsp;BACKGROUND-REPEAT: NO-REPEAT;<br />
            &nbsp;BACKGROUND-POSITION : CENTER;<br />
            }</font></p>
            <p><font size="2" face="Verdana">.......................</font></p>
            <p align="left" class="style4"><br />
            <font face="Tahoma">             <br />
            &nbsp;</font></p>
            </div>
            </center></td>
        </tr>
    </tbody>
</table>
</p>
-----

 
Tripkolic Fan | Html Kodları | Conquer Online | Html Kodları| Webmaster   Sstasarim | Şanişer Fan
 
bugün 31 ziyaretçi (36 klik) kişi burdaydı!
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol