bootstrap4如何实现图片自适应

 剑鱼论坛 发表于 2020年01月27日 CSS/CSS3  97
剑鱼论坛
LV 5 [初中]
最后在线:28分钟前
加入时间:262天前
主帖:84  跟帖:44

现代HTML页面的要求基本上会要求图片能够自适应屏幕,这样的网页不但在pc端可以正常显示图片,同时在手机端等小屏幕上也可以正常显示图片,这篇我们来介绍一下如何使用bootstrap4实现图片自适应。

bootstrap4实现图片自适应是比较简单的,只需要加一个样式就可以了,下面我们来看代码:

<img src="..." class="img-fluid">

以上代码就可以实现图片的自适应,看上面的代码,我们可以发现,其实要实现图片自适应,我们只需要给img标签添加“img-fluid”就可以了。

其中的“src”中的省略号,请换成实际的图片地址即可。

论坛主帖
146
论坛跟帖
110
在线访客
5
今日主帖
1
今日跟帖
0
今日注册
0
88
http://jianyuluntan.com/gentie.html
http://jianyuluntan.com/postzan.html
http://jianyuluntan.com/postcai.html
http://jianyuluntan.com/postshoucang.html
http://jianyuluntan.com/gentiezan.html
http://jianyuluntan.com/gentiecai.html
http://jianyuluntan.com/huifu.html
http://jianyuluntan.com/xiugai.html
http://jianyuluntan.com/shanchugentie.html
1
XzA=
1
© 2019 - 2020 剑鱼论坛 版权所有
Powered by JianYuLunTan
剑鱼论坛 976666861
http://jianyuluntan.com/feedback.html
http://jianyuluntan.com/qiandao.html
http://jianyuluntan.com/denglu.html
0
http://jianyuluntan.com/adenglu.html