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>
Hayalinizdeki web sitesini oluşturmak için izlemeniz gereken ilk adım bir alan adı seçmek ve daha…
Uyuşturucu kartelinin başında bulunan Armando Armas'ın yakalanması gerekmektedir. Ancak Armando soğukkanlı ve ünlü bir katildir.…
Dani Ramos (Natalia Reyes) gelecekten gelen bir terminatör tarafından takip edilmektedir. Bir tarafta sıradan bir…
Araç kiralama yapmak isteyen kişiler gerekli olan prosedürlerden haberdar olmalıdır. Çünkü her şoför araç kiralayamamaktadır.…
Dying Light, 2015 yılında Techland tarafından piyasaya sürülmüş birinci şahıs açılı bir zombi oyunudur. Dying…
Akıllı ev teknolojisi yaklaşık olarak 10 yıldır teknolojinin gündeminde olmasına rağmen, mobil ağının hızlanması ve…