Görüntüler
Görüntüleri duyarlı davranışa seçmeye yönelik belgeler ve örnekler (böylece hiçbir zaman üst öğelerinden daha büyük olmazlar) ve tümü sınıflar aracılığıyla bunlara hafif stiller ekleyin.
Duyarlı görüntüler
Bootstrap'teki resimler ile duyarlı hale getirilir .img-fluid
. max-width: 100%;
ve height: auto;
ana öğeyle ölçeklenecek şekilde görüntüye uygulanır.
SVG görüntüleri ve Internet Explorer
Internet Explorer 10 ve 11'de, SVG görüntüleri .img-fluid
orantısız şekilde boyutlandırılmıştır. Bunu düzeltmek için gerekirse ekleyin width: 100%;
veya ekleyin .w-100
. Bu düzeltme, diğer görüntü biçimlerini hatalı şekilde boyutlandırır, bu nedenle Bootstrap bunu otomatik olarak uygulamaz.
Küçük resimler
Border-radius yardımcı programlarımıza ek olarak , .img-thumbnail
bir görüntüye yuvarlak 1 piksel kenarlık görünümü vermek için kullanabilirsiniz .
Görüntüleri hizalama
Görüntüleri yardımcı kayan sınıflarla veya metin hizalama sınıflarıyla hizalayın . -seviyedeki görüntüler , kenar boşluğu yardımcı sınıfıblock
kullanılarak ortalanabilir ..mx-auto
Resim
Belirli bir öğe için birden çok öğe <picture>
belirtmek üzere öğeyi kullanıyorsanız , sınıfları etikete değil etikete eklediğinizden emin olun .<source>
<img>
.img-*
<img>
<picture>