Forum'da ara:
Ara


Yazar Mesaj
Mesaj03.04.2011, 15:27 (UTC)    
Mesaj konusu: CSS Kodun Yanlışlığı
Alıntıyla Cevap Gönder
Arkadaşlar ben bu temayı css desing da uyguladım ama sitem yokoldu neredeyse. Nasıl temayı yapabilirim!

Üst
Kod:
<head>
   <title>Kişisel Site Psd to Css // ruhum</title>
    <link rel="stylesheet" href="style.css" type="text/css" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<div class="Sayfa">

   <!--////// Logo Başlangıç //////-->
   <div class="Logo"><img src="http://i23.servimg.com/u/f23/13/73/65/25/logo11.png" /></div>
   <!--////// Logo Bitiş //////-->
   
<!--////// Üst Bağlantılar Başlangıç //////-->
<div class="Ust">
    <div class="UstBg">
        <div class="UstBaglantilar">
            <div class="AnaSayfaikon"><a href="#">Home</a></div>
            <div class="UyeOlikon"><a href="#">Register</a></div>
            <div class="istatistiklerikon"><a href="#">Stats</a></div>
            <div class="iletisimikon"><a href="#">Contact</a></div>
        </div>
        <a href="#"><img src="http://i23.servimg.com/u/f23/13/73/65/25/rss10.png" class="Rss" /></a>
    </div>
</div>
<!--////// Üst Bağlantılar Bitiş //////-->
   
   
<div class="ArkaplanOrta">
   
    <!--////// Sol Bölüm Başlangıç //////-->
<div class="SolDuzen">

    <!--////// Kullanıcı Paneli Başlangıç //////-->
    <div class="Sol">
        <div class="SolUst">
            <div class="SolUstYazi">User Panel</div>
        </div>
            <div class="SolOrta">
           
                <div class="KullaniciAdiSifre">User Name</div>
                <div class="Sil"></div>
                <div class="KullanciGirisiDuzen">
                <div class="KullaniciSol"></div><input type="text" class="KullaniciSag" />
                </div>
               
                <div class="KullaniciAdiSifre">User Name</div>
                <div class="Sil"></div>
                <div class="KullanciGirisiDuzen">
                <div class="ParolaSol"></div><input type="password" class="KullaniciSag" />
                </div>
                <div class="Sil"></div>
               
                <input type="submit" class="GirisButonu" value="Enter..." />
                <div class="ParolamiUnuttum">
                <div class="Sifremiunuttum"></div>
                <a href="#">Lost Password?</a>
                </div>
            </div>
        <div class="SolAlt"></div>
    </div>
    <!--////// Kullanıcı Paneli Bitiş //////-->
   
   
<div class="Sil"></div>

    <!--////// Kategori Alanı Başlangıç //////-->
<div class="Sol">
    <div class="SolUst">
        <div class="SolUstYazi">Category</div>
    </div>
    <div class="SolOrta">
        <div class="Kategoriler">
        <div class="Kirmizi"></div><a href="#">Freeware</a>
        </div>
       
        <div class="Kategoriler">
        <div class="Yesil"></div><a href="#">Portable</a>
        </div>
       
        <div class="Kategoriler">
        <div class="Yesil"></div><a href="#">Photoshop Tuts</a>
        </div>
       
        <div class="Kategoriler">
        <div class="Yesil"></div><a href="#">Illustrator Tuts</a>
        </div>
       
        <div class="Kategoriler">
        <div class="Yesil"></div><a href="#">Video Tuts</a>
        </div>
       
        <div class="Kategoriler">
        <div class="Yesil"></div><a href="#">Technology</a>
        </div>
       
        <div class="Kategoriler">
        <div class="Yesil"></div><a href="#">Why Us?</a>
        </div>
    </div>
    <div class="SolAlt"></div>
</div>
    <!--////// Kategori Alanı Bitiş //////-->

<div class="Sil"></div>

    <!--////// Sol Reklam Alanı Başlangıç //////-->
<div class="Sol">
    <div class="SolUst">
        <div class="SolUstYazi">Advertise Panel</div>
    </div>
    <div class="SolOrta">
        <img src="http://i23.servimg.com/u/f23/13/73/65/25/reklam12.png" width="197" height="165" class="SolReklam"  />           
    </div>
    <div class="SolAlt"></div>
</div>
    <!--////// Sol Reklam Alanı Bitiş //////-->

<div class="Sil"></div>

    <!--////// Sol Bağlantı Alanı Başlangıç //////-->
<div class="Sol">
    <div class="SolUst">
        <div class="SolUstYazi">Connections</div>
    </div>
   
    <div class="SolOrta">
        <div class="BaglantilarDuzen">
            <a href="#"><img src="http://i23.servimg.com/u/f23/13/73/65/25/baglan10.png" width="38" height="38" class="Baglantilar"  /></a>
            <a href="#"><img src="http://i23.servimg.com/u/f23/13/73/65/25/kalp10.png" width="38" height="38" class="Baglantilar"  /></a>
            <a href="#"><img src="http://i23.servimg.com/u/f23/13/73/65/25/baglan10.png" width="38" height="38" class="Baglantilar"  /></a>
            <a href="#"><img src="http://i23.servimg.com/u/f23/13/73/65/25/yildiz10.png" width="38" height="38" class="Baglantilar"  /></a>
        </div>
    </div>
    <div class="SolAlt"></div>
</div>
    <!--////// Sol Bağlantı Alanı Bitiş //////-->

<div class="Sil"></div>
</div>
    <!--////// Üst Sol Bölüm Bitiş //////-->


Alt

Kod:
</div>
<!--////// İçerik Başlangıç //////-->
    <!--////// İçerik Bitiş //////-->
    <!--////// Al Bölüm Başlangıç //////-->
<div class="ArkaplanAlt">
    <div class="AltYaziBaglantilar"><a href="#">Home</a> | <a href="#">Contact</a> | <a href="#">SiteMap</a></div>
    <div class="AltYaziAciklama">Copyright 2010 <u>SiteName.com</u>. All Rights Reserved.</div>
</div>
    <!--////// Al Bölüm Bitiş //////-->

</div>
</body>
</html>


CSS
Kod:
table {margin-left: auto;margin-right: auto}
h1#title{display: none;}
h2#title span {display: none;}
div.header{display: none;}
li.nav_element{list-style-type: none;}
li.nav_element{display: none;}

body{
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/arkapl16.jpg);
   background-repeat: no-repeat;
   text-align: center;
   
}

.Sayfa{
   width: 900px;
   margin-left: auto;
   margin-right: auto;
}
/*### Logo Başladıngıç ###*/
.Logo{
   width: 900px;
   height: 115px;
   margin-top: 27px;
}
/*### Logo Bitti ###*/

/*### Üst Bağlantılar Başlangıç ###*/
.Ust{
   width: 900px;
   height: 39px;
   margin-top: 8px;
}

.UstBg{
   width: 900px;
   height: 49px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/ust11.png);
   background-repeat: no-repeat;
   float: left;
   text-align: left;
}

.UstBaglantilar{
   width: 630px;
   height: 19px;
   float: left;
   margin-top: 19px;
   margin-left: 70px;
   position: absolute;
   font: 15px arial;
   color: #FFF;
}

.AnaSayfaikon{
   width: 138px;
   float: left;
}

.UyeOlikon{
   width: 104px;
   margin-left: 45px;
   float: left;
}

.istatistiklerikon{
   width: 138px;
   margin-left: 40px;
   float: left;
}

.iletisimikon{
   width: 117px;
   margin-right: 10px;
   float: right;
}

.Rss{
   width: 49px;
   float: right;
   margin-top: 13px;
   border: 0px;
}

.UstBaglantilar a:link, .UstBaglantilar a:visited{
   color: #FFF;
   text-decoration: none;
}

.UstBaglantilar a:hover, .UstBaglantilar a:active{
   color: #FFF;
   text-decoration: none;
}

/*### Üst Bağlantılar Bitiş ###*/

/*### İçerik Arkaplan Başlangıç ###*/
.ArkaplanUst{
   width: 900px;
   height: 6px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/navbar18.png);
   background-repeat: no-repeat;
}

.ArkaplanOrta{
   width: 900px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/icsayf10.png);
   float: left;
   margin-top: 0px;
}

.ArkaplanAlt{
   width: 900px;
   height: 45px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/icsayf11.png);
   background-repeat: no-repeat;
   float: left;
}
/*### İçerik Arkaplan Başlangıç ###*/

/*### Sol Menü Başlangıç ###*/
.Sol{
   width: 220px;
   float: left;
   margin-top: 7px;
   margin-bottom: 13px;
}

.SolDuzen{
   width: 220px;
   float: left;
   margin-left: 15px;
}

.SolUst{
   width: 219px;
   height: 56px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/solust10.png);
   background-repeat: no-repeat;
   float: left;
}

.SolUstYazi{
   font: 14px arial;
   font-weight: bold;
   color: #FFF;
   margin-top: 23px;
   float: left;
   margin-left: 24px;
}
.SolOrta{
   width: 217px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/solort10.png);
   background-repeat: repeat-y;
   float: left;
   margin-left: 2px;
}

.SolAlt{
   width: 212px;
   height: 4px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/solalt11.png);
   background-repeat: no-repeat;
   float: left;
   margin-left: 7px;
}

.KullaniciAdiSifre{
   width: 142px;
   font: 14px arial;
   font-weight: bold;
   color: #656565;
   float: left;
   margin-left: 14px;
   text-align: left;
   margin-top: 10px;
}

.KullaniciSol{
   width: 29px;
   height: 23px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/kullan10.png);
   background-repeat: no-repeat;
   float: left;
   margin-left: 14px;
}

.KullaniciSag{
   width: 142px;
   height: 23px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/kullan11.png);
   background-repeat: no-repeat;
   float: left;
   border: 0px;
   font: 14px arial;
   color: #8c8c8c;
   font-weight: bold;
   padding-top: 3px;
}

.KullanciGirisiDuzen{
   width: 199px;
   height: 23px;
   float: left;
}
.ParolaSol{
   width: 29px;
   height: 23px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/parola10.png);
   background-repeat: no-repeat;
   float: left;
   margin-left: 14px;
}

.GirisButonu{
   width: 84px;
   height: 23px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/girisb10.png);
   background-repeat: no-repeat;
   background-color: #FFF;
   float: right;
   margin-right: 29px;
   margin-top: 5px;
   font: 13px arial;
   font-weight: bold;
   color: #FFF;
   padding-bottom: 5px;
   border: 0px;
}

.ParolamiUnuttum{
   width:142px;
   height: 16px;
   float: left;
   margin-left: 14px;
   font: 13px arial;
   font-weight: bold;
   color: #0081d7;
   text-align: left;
   margin-top: 7px;
}

.ParolamiUnuttum a:link, .ParolamiUnuttum a:visited{
   color: #0081d7;
}

.ParolamiUnuttum a:hover, .ParolamiUnuttum a:active{
   color: #0081d7;
}

.Sifremiunuttum{
   width:16px;
   height: 16px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/parola11.png);
   background-repeat: no-repeat;
   float: left;
   margin-right: 3px;
   margin-top: 1px;
}

.Kategoriler{
   width: 185px;
   float: left;
   text-align: left;
   font: 14px arial;
   font-weight: bold;
   color: #404040;
   margin-left: 14px;
   margin-top: 2px;
}

.Kategoriler a:link, .Kategoriler a:visited{
   color: #404040;
   text-decoration: none;
}

.Kategoriler a:hover, .Kategoriler a:active{
   color: #5b5b5b;
   text-decoration: underline;
}

.Kirmizi{
   width: 21px;
   height: 19px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/kirmiz10.png);
   background-repeat: no-repeat;
   float: left;
}

.Yesil{
   width: 21px;
   height: 19px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/yesil10.png);
   background-repeat: no-repeat;
   float: left;
}

.SolReklam{
   width: 197px;
   height: 165px;
   margin-left: 4px;
}

.BaglantilarDuzen{
   width: 196px;
   float: left;
   margin-left: 15px;
}

.Baglantilar{
   width: 38px;
   height: 38px;
   float: left;
   margin-left: 7px;
   border: 0px;
}

.Sil{
   clear: both;
}
/*### Sol Menü Bitiş ###*/

/*### Orta Kısım(İçerik) Başlangıç ###*/
.OrtaKisim{
   width: 642px;
   float: left;
   margin-left: 12px;
   margin-top: 7px;
   margin-bottom: 11px;
}

.icOrtaUst{
   width: 642px;
   height: 45px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/icorta10.png);
   background-repeat: no-repeat;
   float: left;
}

.icOrtaOrta{
   width: 642px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/icorta11.png);
   background-repeat: repeat-y;
   float: left;
}

.icOrtaAlt{
   width: 642px;
   height: 29px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/icorta12.pngg);
   background-repeat: no-repeat;
   float: left;
}

.Baslik{
   width: 642px;
   height: 38px;
   float: left;
   margin-top: 7px;
}

.Baslikikon{
   width: 32px;
   height: 30px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/baslik10.png);
   background-repeat: no-repeat;
   float: left;
   margin-left: 13px;
}

.BaslikYazi{
   font: 24px arial;
   color: #006cc2;
   float: left;
   margin-top: 5px;
   margin-left: 5px;
}

.Puanlama{
   width: 67px;
   font: 16px arial;
   color: #006cc2;
   float: right;
   text-align: left;
   margin-top: 8px;
}

.PuanlamaYazi{
   font: 16px arial;
   color: #006cc2;
   float: left;
}

.YesilButonArti{
   width: 17px;
   height: 17px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/arti10.png);
   background-repeat: no-repeat;
   float: left;
   border: 0px;
}

.KirmiziButonEksi{
   width: 17px;
   height: 17px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/eksi10.png);
   background-repeat: no-repeat;
   float: right;
   border: 0px;
   margin-right: 13px;
}

.icerik{
   width: 612px;
   font: 13px arial;
   color: #424242;
   margin-left: 20px;
   margin-top: 9px;
   float:left;
   text-align: left;
   padding-bottom: 11px;
}

.icerikSolResim{
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/resim110.png);
   border: 4px solid #e1e1e1;
   float: left;
   margin-right: 8px;
}

.Aciklama{
   width: 601px;
   float: left;
   margin-left: 20px;
   font: 16px arial;
   color: #515151;
}

.Yonetici{
   height: 22px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/yoneti10.png);
   background-repeat: no-repeat;
   float: left;
   padding-left: 26px;
}

.AciklamaYazi{
   font: 16px arial;
   color: #515151;
   float: left;
   display: block;
}

.Yorum{
   height: 24px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/yorums10.png);
   background-repeat: no-repeat;
   float: left;
   margin-left: 34px;
   padding-left: 32px;
}

.Tarih{
   height: 24px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/tarih10.png);
   background-repeat: no-repeat;
   float: left;
   margin-left: 34px;
   padding-left: 27px;
}

.DevaminiOku{
   width: 84px;
   height: 23px;
   background-image: url(http://i23.servimg.com/u/f23/13/73/65/25/devami10.png);
   background-repeat: no-repeat;
   background-color: #FFF;
   float: right;
   border: 0px;
   font: 11px arial;
   font-weight: bold;
   color: #FFF;
   padding-top: 2px;
}

.DevaminiOku a:link, .DevaminiOku a:visited{
   color: #FFF;
   text-decoration: none;
}

.DevaminiOku a:hover, .DevaminiOku a:active{
   color: #FFF;
   text-decoration: none;
}

/*### Orta Kısım(İçerik) Bitiş ###*/

/*### Alt Bilgiler Başlangıç ###*/
.AltYaziBaglantilar{
   font: 13px arial;
   color: #e8e8e8;
   float: left;
   margin-top: 15px;
   margin-left: 22px;
}

.AltYaziBaglantilar a:link, .AltYaziBaglantilar a:visited{
   color: #e8e8e8;
   text-decoration: none;
}

.AltYaziBaglantilar a:hover, .AltYaziBaglantilar a:active{
   color: #e8e8e8;
   text-decoration: underline;
}


.AltYaziAciklama{
   font: 13px arial;
   color: #e8e8e8;
   float: right;
   margin-top: 15px;
   margin-right: 16px;
}

/*### Alt Bilgiler Bitiş ###*/


Bunları nereye uygularım işte olması gereken site!

http://i45.tinypic.com/sg6dg6.png
benim site
http://liselikids.tr.gg/
↑
Mesaj03.04.2011, 15:34 (UTC)    
Mesaj konusu:
Alıntıyla Cevap Gönder
Siteniz Bende Düzgün Görünüyor..!
______________

NETTEN PARA KAZAN ..!
CSS TASARIMLAR
↑
Mesaj03.04.2011, 15:42 (UTC)    
Mesaj konusu:
Alıntıyla Cevap Gönder
Şaka galiba ben de böyle görünüyor!

http://oi56.tinypic.com/2d0yhyt.jpg

Bütün ayarlamaları da yapmıştım! Sad
↑
Mesaj03.04.2011, 15:52 (UTC)    
Mesaj konusu:
Alıntıyla Cevap Gönder
Al Bak Ekran Görüntüsü


______________

NETTEN PARA KAZAN ..!
CSS TASARIMLAR
↑
Mesaj03.04.2011, 16:00 (UTC)    
Mesaj konusu:
Alıntıyla Cevap Gönder
tarayıcını sorabilir miyim? Ben chrome dan da mozilla dan da giremedim!
↑
Mesaj03.04.2011, 16:16 (UTC)    
Mesaj konusu:
Alıntıyla Cevap Gönder
Tarayıcım Mozilla Wink Resimden Belli Olmuyor Mu...?
______________

NETTEN PARA KAZAN ..!
CSS TASARIMLAR
↑
Önceki mesajları göster:   
  • 1. sayfa (Toplam 1 sayfa)

  •  
    • Geçiş Yap:  


Powered by phpBB © 2001, 2005 phpBB Group
Türkçe Çeviri: phpBB Türkiye & Erdem Çorapçıoğlu

© 2024 webme GmbH, Almanya, Tüm hakları saklıdır.