Bina ben bir sayfada 5 eşit sütun olmasını istiyorum ve 5 sütun ızgara burada http://web.archive.org/web/20120416024539/http://domain7.com/mobile/tools/bootstrap/responsive nasıl kullanıldığını anlamak için görünmüyor olabilir

Beş sütun ızgara twitter kısmı yukarıda gösterilen çerçeve bootstrap.

Ve yukarıdaki Bootstrap 3 için

Bir harikatam genişlikTwitter Bootstrap ile 5 sütun düzeni here oluşturuldu.

Bu Bootstrap 3 ile sorunsuz bir şekilde çalışır beri en gelişmiş çözümdür. Yeniden kullanım sınıfları tekrar tekrar, duyarlı tasarım için geçerli Bootstrap dersleri çifti sağlar.

İlk başta bunu Bootstrap şekilde varsayılan sütun tanımı oluşturmanız gerekir. Onları diğer adları ile karışık alamadım bu yüzden col-*-5ths arayın. Bir sonraki farklı medya sorguları halinde yeni sınıflar genişliğini tanımlamak gerekir.

CSS:< / ^ br . Eğer Bootstrap altına genel stil için, hatta bu ekleyin.css belge.

.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}

Örneğin HTML:< / ^ br . Eğer daha küçük olanlar üzerinde iki sütun gibi orta ekranlarında beş sütun düzeni gibi davranan bir div öğesi oluşturmak istiyorsanız, örneğin, sadece bu gibi bir şey kullanmak gerekir:

<div class="row">
    <div class="col-md-5ths col-xs-6">
       ...
    </div>
</div>

WORKING DEMO - kare sütun duyarlı hale görmek için Genişletin.

ANOTHER DEMO - başkaları ile col-*-5ths yeni sınıfları İçeren col-*-3 col-*-2 gibi. Çerçeve hepsini duyarlı görünümünde col-xs-6 değişikliği görmek için yeniden boyutlandırma.