Webmaster Forumu

Hoşgeldiniz
 
AnasayfaTakvimSSSAramaÜye ListesiKullanıcı GruplarıKayıt OlGiriş yap

Paylaş | 
 

 Css Ile Basit Bir Ilerleme Durum çubuğu Yapımı

Aşağa gitmek 
YazarMesaj
Admin
Admin


Mesaj Sayısı : 123
Kayıt tarihi : 28/07/09

MesajKonu: Css Ile Basit Bir Ilerleme Durum çubuğu Yapımı   Salı Tem. 28, 2009 7:41 pm

Kimi zaman istatistik grafiklerinden kimi zamanda yüklenme grafiklerinde, ilerleme durum çubukları oluşturabiliyoruz. Bunlar için genelde resim dosyaları kullanmaktayız ya da tablolar. Fakat resim dosyadan olmadan bu işi css ile basit bir şekilde halledebilirsiniz


Super simple CSS bars başlığında bu yöntem anlatılmış. Oradan örnek alacak olursak yapmamız gerekenler şöyle.

Öncelikle kullanacağımız html kodumuz şunlar.


Kod:
<div class="progress-container">
<div style="width: 95%"></div>
</div>

Ve css kodları ise şöyle.


Kod:
div.progress-container {
border: 1px solid #ccc;
width: 100px;
margin: 2px 5px 2px 0;
padding: 1px;
float: left;
background: white;
}


Kod:
div.progress-container > div {
background-color: #ACE97C;
height: 12px
}
Sayfa başına dön Aşağa gitmek
Kullanıcı profilini gör http://forumaster.ace.st
 
Css Ile Basit Bir Ilerleme Durum çubuğu Yapımı
Sayfa başına dön 
1 sayfadaki 1 sayfası
 Similar topics
-
» TDOF Son Durum

Bu forumun müsaadesi var:Bu forumdaki mesajlara cevap veremezsiniz
Webmaster Forumu  :: Web Tasarım :: Scriptler-
Buraya geçin: