Markdown+Bootstrap图片自适应属性_html/css_WEB-ITnose
程序员文章站
2022-04-21 22:45:32
...
Markdown是一个很好的标记语言,越来越流行作为编辑器的语法,Bootstrap是一个前端框架,那么问题来了,Markdown的图片标记如:![alt](url),在页面上通常会转换成html,这个时候如何给图片加Bootstrap的图片自适应属性.img-responsive?
如:
用js就好了:
$(".content img").addClass('img-responsive');
别忘了在html的head标签内加上:
这样在手机小屏幕上,图片也能够自动缩放了,同时不影响Bootstrap的自适应布局。.img-responsive属性其实也就是给图片加block,max-width:100%的属性。
推荐阅读
-
html2canvas属性和使用方法以及如何使用html2canvas将HTML内容写入Canvas生成图片
-
2个属性用CSS实现图片自适应浏览器
-
HTML连载79-背景图片定位区域属性、背景颜色
-
background-size 设置背景图片的大小_html/css_WEB-ITnose
-
纯CSS3实现图片展示特效_html/css_WEB-ITnose
-
CSS3 实现六边形Div图片展示效果_html/css_WEB-ITnose
-
页面引用小图片问题_html/css_WEB-ITnose
-
像csdn博客文章中图片和文字、代码等的排版是如何在服务器数据库中存储的?_html/css_WEB-ITnose
-
CSS控制显示图片的一部分_html/css_WEB-ITnose
-
IE9中CSS2 height属性失效问题_html/css_WEB-ITnose