İçerikte Kullanılabilen Progress (ilerleme) Göstergeleri

Merhabalar OnlinePvpServers Üyeleri ve ziyaretçiler,

Bu platform üzerinde makale veya tanıtım oluştururken ekstra özellikler ve tasarımlar katarak içeriğinizi zenginleştirmek mümkün bugun bu makale ile size ilerleme çubuklarını gösterecek ve kodlarını vereceğiz.


 
<div class="mg-b-20 progress">
<div class="progress-bar wd-25p">&nbsp;</div>
</div>
 
<div class="mg-b-20 progress">
<div class="bg-success progress-bar wd-35p">&nbsp;</div>
</div>
 
<div class="mg-b-20 progress">
<div class="bg-warning progress-bar wd-50p">&nbsp;</div>
</div>
 
<div class="mg-b-20 progress">
<div class="bg-danger progress-bar wd-65p">&nbsp;</div>
</div>
 
<div class="progress">
<div class="bg-indigo progress-bar wd-75p">&nbsp;</div>
</div>

Class alanındaki bg- kısmına gelecek değeri değiştirerek renk belirleyebilirsiniz renk çeşitleri alttaki tabloda göründüğü gibidir.

Class Value
class="progress-bar bg-[value]" primary | success | warning | danger | info | teal | indigo | purple | orange | pink
 
<div class="mg-b-20 progress">
<div class="progress-bar progress-bar-striped wd-25p">&nbsp;</div>
</div>
 
<div class="mg-b-20 progress">
<div class="bg-success progress-bar progress-bar-striped wd-35p">&nbsp;</div>
</div>
 
<div class="mg-b-20 progress">
<div class="bg-warning progress-bar progress-bar-striped wd-50p">&nbsp;</div>
</div>
 
<div class="mg-b-20 progress">
<div class="bg-danger progress-bar progress-bar-striped wd-65p">&nbsp;</div>
</div>
 
<div class="progress">
<div class="bg-info progress-bar progress-bar-striped wd-75p">&nbsp;</div>
</div>

Boyut Süper Ekstra Küçük

 
<div class="mg-b-10 progress">
<div class="ht-2 progress-bar wd-25p">&nbsp;</div>
</div>
 
<div class="mg-b-10 progress">
<div class="bg-success ht-2 progress-bar wd-35p">&nbsp;</div>
</div>
 
<div class="progress">
<div class="bg-danger ht-2 progress-bar wd-50p">&nbsp;</div>
</div>

Boyut Ekstra Küçük

 
<div class="mg-b-10 progress">
<div class="progress-bar progress-bar-xs wd-25p">&nbsp;</div>
</div>
 
<div class="mg-b-10 progress">
<div class="bg-success progress-bar progress-bar-xs wd-35p">&nbsp;</div>
</div>
 
<div class="progress">
<div class="bg-danger progress-bar progress-bar-xs wd-50p">&nbsp;</div>
</div>

Küçük boy

 
<div class="mg-b-10 progress">
<div class="progress-bar progress-bar-sm wd-25p">&nbsp;</div>
</div>
 
<div class="mg-b-10 progress">
<div class="bg-success progress-bar progress-bar-sm wd-35p">&nbsp;</div>
</div>
 
<div class="progress">
<div class="bg-danger progress-bar progress-bar-sm wd-50p">&nbsp;</div>
</div>

Normal Boy

 
<div class="mg-b-10 progress">
<div class="progress-bar wd-25p">&nbsp;</div>
</div>
 

 

<div class="mg-b-10 progress">
<div class="bg-success progress-bar wd-35p">&nbsp;</div>
</div>
 
<div class="progress">
<div class="bg-danger progress-bar wd-50p">&nbsp;</div>
</div>

Büyük boy

 
<div class="mg-b-10 progress">
<div class="progress-bar progress-bar-lg wd-25p">&nbsp;</div>
</div>
 
<div class="mg-b-10 progress">
<div class="bg-success progress-bar progress-bar-lg wd-35p">&nbsp;</div>
</div>
 
<div class="progress">
<div class="bg-danger progress-bar progress-bar-lg wd-50p">&nbsp;</div>
</div>

Class alanında tabloda bulunan özellikleri verdiğiniz zaman farklı boyutlar'da ilerleme çizgisi oluşturabilirsiniz.

SINIF DEĞER
class="progress-bar ht-2" Sınıfı kullanarak süper ekstra küçük bir ilerleme boyutu  .ht-2.
class="progress-bar progress-bar-xs" Ekstra küçük bir ilerleme boyutu.
class="progress-bar progress-bar-sm" Küçük bir ilerleme boyutu.
class="progress-bar progress-bar-lg" Büyük bir ilerleme boyutu.
50%
<div class="mg-b-10 progress">
<div class="progress-bar wd-50p">50%</div>
</div>
60%
<div class="mg-b-10 progress">
<div class="bg-success progress-bar wd-60p">60%</div>
</div>
95%
<div class="progress">
<div class="bg-danger progress-bar wd-95p">95%</div>
</div>
YAZAR HAKKINDA;
admin
Arcface

PHP Developer

Olduğu yerde saymak yerine ileriyi hedefleyen sıradan bir php geliştiricisi

Image

LAB

İçerikte Kullanılabilen Progress (ilerleme) Göstergeleri

Platform üzerin'de makale ve tanıtım oluştururken işinize yarayabilecek bir çok özellik ve tasarım bulunmaktadır. İlerleme çubuğu, göstergesi'de bunlardan biridir.

EN ÇOK OKUNAN 5 MAKALELER
admin
Arcface Yazdı;

10 ay önce

Metin2'ye 2017 yılında 115 level itemleri olarak gelmişlerdir. Silahla..

admin
Arcface Yazdı;

10 ay önce

Metin2'ye 2018 yılında Zodyak Tapınağı Haritası eklentisiyle gelmişler..

admin
Arcface Yazdı;

10 ay önce

Metin2 de bulunan savaşçı, ninja, sura, şaman ve lycan karakterinin zı..

PLAYERUNKNOWN'S BATTLEGROUNDS 22 haziranda gelen güncellenme ile bir ..

admin
Arcface Yazdı;

9 ay önce

Metin2 Tr tipi pvp scripti - Tr tipi metin2 scripti ücretli satışını y..