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.
<progress value="" max=""></progress>
Kod içindeki ifadeler ne anlama geliyor? Aşağıdaki tablodan her ifadenin ne işe yaradığını öğrenebilirsiniz.
Ö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 |
%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>
Stok fotoğrafçılığından grafiklere, çizelgelere ve infografiklere blog gönderilerinizde göstermek için kullanabileceğiniz resim türleri çoktur. Peki hangi gönderi için hangi türü…
Counter-Strike: Global Offensive herkesin eğlenebileceği kadar basit aynı zamanda en uzman oyuncuları bile tatmin edecek kadar karmaşık bir oyundur. Oyundaki…
Conjuring ve Annabelle filmleri iki farklı sırada izlenebilir. Annabelle Comes Home'un vizyona girmesiyle birlikte The Conjuring evreni toplamda yedi filme…
Oyun dünyasındaki gelişimi birçok sektöründe yakından takibinde ve bu alana yönelmesinde öncü olmuş durumda. Günümüzde birçok markanın bilgisayarlarını bu alanda…
Ölüler ayağa kalktığında eskileri hatırlamak önemlidir! Bu listede uzun zamandır beklenen devam filmi ile ilgili temel gerçekleri ve temel bilgileri…
"Windows'u Etkinleştir" yazısını kaldırmak için internette birçok yöntem mevcut. Çoğunluğunda da Windows'u Etkinleştir yazısı kaldırma işlemi için kayıt defteri düzenlenmesi…