Bootstrap Ekrana Göre Metinlerin büyümesi ve küçülmesi
Şöyle bir sorunum var;
Bootstrap alt yapısına sahip bir tasarım ekran boyutuna göre büyüyor. Sayfanın yakınlaştır özelliğini 100%'den 90%'a yaptığımızda istediğimiz görünüme ulaşıyor. Bu durumda tüm ekran koşullarında mevcut durumunu nasıl koruyacağız.
Şimdiden teşekkür ederim.
CSS ile kendin ayarlıycaksın mesela form-control
sınıfına sahip olanların width
değerini düşürelim.
@media (max-width: 1000px) {
.form-control {
width: 100%;
}
}
@media (max-width: 900px) {
.form-control {
width: 90%;
}
}
@media (max-width: 800px) {
.form-control {
width: 80%;
}
}
max-width
'in değeri cihazın genişliği ne kadarsa ona göre ayarlaması için. Mesela biz 1000px
yazdık. Eğer cihaz 1000px veya aşağısıysa o uygulanacak.
Detaylı bir örnek: https://www.w3schools.com/cssref/css3_pr_mediaquery.asp