简体   繁体   English

使用Bootstrap的响应式图像

[英]Responsive images using Bootstrap

As any front dev' I've got a bunch of problem with responsiv images. 任何前面的开发者'我都有一些问题与责任图像。 Trying to make them fit properly any kind of container is some how an hell. 试图使它们适合任何类型的容器是一个多么地狱。

While looking and asking across the web how should I properly do that I have came up with ImgLiquid . 在查看和询问网络时,我应该如何正确地做到这一点,我想出了ImgLiquid Pretty and efficace. 漂亮而有效。 But I'm not really fan of adding plugins and plugins. 但我并不喜欢添加插件和插件。 And because I'm already using Bootstrap I was asking my self if there was a way of doing it with Bootstrap. 而且因为我已经在使用Bootstrap,我问自己是否有一种方法可以使用Bootstrap。

I've seen the class .img-responsive but it seems not to be very effective. 我已经看过班级.img-responsive但似乎不是很有效。

So, do you know a way using bootstrap of managing properly responsive image as if I was using ImgLiquid ? 那么,你是否知道使用bootstrap管理正确响应图像的方式,就像我使用ImgLiquid一样?

Just so you can have an idea : This is what I've got using bootstrap : 这样你就可以有一个想法:这就是我使用bootstrap得到的:

例

cal class="width-full"

create style 创造风格

<style>
.width-full{width: 100%;}
</style>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM