bootstrap4如何实现图片自适应

 剑鱼论坛 发表于 2020年01月27日 CSS/CSS3  425
剑鱼论坛
LV 8 研究生
最后在线:2年前
加入时间:5年前
主帖:143  跟帖:100

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

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

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

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

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

论坛主帖
288
论坛跟帖
316
在线访客
0
今日主帖
0
今日跟帖
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
cmVsZWFzZV8w
0
© 2019 - 2024 剑鱼论坛 版权所有
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
0
剑鱼论坛