Kategoriler: Webmaster

HTML5 Progress Bar (İlerleme Çubuğu)

Progress bar (ilerleme çubuğu) genellikle bir süreci veya devam eden bir durumu grafik üzerinde göstermek için kullanılır. Bu güzel HTML5 nimetinden faydalanmak için aşağıdaki kodu kullanmalısınız.

HTML5 Progress Bar (İlerleme Çubuğu) Kodu

<progress value="" max=""></progress>

Özellikler

Kod içindeki ifadeler ne anlama geliyor? Aşağıdaki tablodan her ifadenin ne işe yaradığını öğrenebilirsiniz.

HTML5 Progress Bar (İlerleme Çubuğu) Özellikleri
Öznitelikler Ne İşe Yarar?
value Değere atanan numara yapılan görevin yüzdesini belirtir.
max Bu değer çubuğun en fazla nereye kadar ilerleyebileceğini belirtir.
width Çubuğun genişliğini belirtir. İlerleme yüzdesi ve maksimum değer de bu değere oranla genişler.
height Çubuğun yüksekliği.
vertical-align İlerleme çubuğunu diğer nesnelere göre hizalamak için kullanılır.
background-color Varsayılan gri rengi değiştirmek için kullanılır.
display Varsayılan değer inline-block belirlenmiştir.
Uyumlu olduğu tarayıcılar

 

Kullanım Senaryoları

%55 dolu olan.

<progress value="55" max="100"></progress>

İleri geri giden.

<progress max="100"></progress>

0.8’den 0.6’sı dolu olan

<progress max="0.8" value="0.6"></progress>
Rate this post
Furkan Özden

Blog dünyası ile 2009 yılında tanıştım. Bloğumda haftada en az bir yazı yayımlıyorum. Yazdığım yazıları beğendiyseniz beni Twitter'dan (@frknzdn) takip edebilirsiniz. Daha fazlası için hakkımda sayfasını ziyaret edin.

Paylaş
Yazar
Furkan Özden

Son Gönderiler

Tek Konulu ve Çok Konulu Blog ile Pazarlama Fikirleri

Pazarlama, hedef kitlenizi büyütmenize, trafiği artırmanıza ve içeriğinizi görmeyecek yeni okuyuculara ulaşmanıza yardımcı olur. Bir blog…

2 gün önce

Tek Konulu ve Çok Konulu Blog Yazmanın Artıları ve Eksileri

Artıları Bazı durumlarda içerik oluşturmak daha kolay ve daha hızlıdır - daha fazla içerik seçeneğiniz…

2 hafta önce

Çok Konulu Blog Yazmak İçin Bilmeniz Gerekenler

Çok nişli bir blog oluşturmayı planlıyorsanız, başka bir nişe dalmadan önce mümkün olduğunca tek bir…

1 ay önce

Tek Konulu ve Çok Konulu Bloglar için İçerik Oluşturma

Söylenildiği gibi, içerik kraldır. Yüksek kaliteli içerik oluşturabilirseniz trafik çekecek ve para kazanacak duruma gelebilirsiniz. Çok nişli…

1 ay önce

Tek Konulu ve Çok Konulu Blog Farkları Nelerdir?

Bir blog yazmaya başlamanın en zor kısımlarından biri, ne hakkında blog yazacağınıza karar vermektir. Seçtiğiniz niş(ler),…

2 ay önce

T129 ATAK War Thunder’a Geliyor!

T129 ATAK, İtalyan A129 Mangusta taarruz helikopterinin yerli olarak modifiye edilmiş ve Türkiye tarafından Türk…

2 ay önce