Markdown与Bootstrap相结合实现图片自适应属性
更新时间：2016年05月04日 09:26:24 投稿：mrr
Markdown 是一种轻量级的标记语言，它的优点很多，目前也被越来越多的写作爱好者，撰稿者广泛使用。接下来通过本文给大家介绍Markdown与Bootstrap相结合实现图片自适应属性，感兴趣的朋友一起学习吧
先给大家说下Markdown的基本概念及优点
Markdown是一种可以使用普通文本编辑器编写的标记语言，通过简单的标记语法，它可以使普通文本内容具有一定的格式。
Markdown 是一种轻量级的标记语言，它的优点很多，目前也被越来越多的写作爱好者，撰稿者广泛使用。看到这里请不要被标记、语言所迷惑，Markdown 的语法十分简单。常用的标记符号也不超过十个，这种相对于更为复杂的 HTML 标记语言来说，Markdown 可谓是十分轻量的，学习成本也不需要太多，且一旦熟悉这种语法规则，会有一劳永逸的效果。
使用 Markdown 的优点
专注你的文字内容而不是排版样式，安心写作。
轻松的导出 HTML、PDF 和本身的 .md 文件。
纯文本内容，兼容所有的文本编辑器与字处理软件。
随时修改你的文章版本，不必像字处理软件生成若干文件版本导致混乱。
可读、直观、学习成本低。
Markdown是一个很好的标记语言，越来越流行作为编辑器的语法，Bootstrap是一个前端框架，那么问题来了，Markdown的图片标记如：，在页面上通常会转换成html，这个时候如何给图片加Bootstrap的图片自适应属性.img-responsive?
如：
<img alt=”武汉光谷” src=”http://cdn.tanteng.me/uploads/2016/05/guang-gu.jpg” class=”img-responsive”>
用js就好了：
<scripttype="text/javascript">
$(".content img").addClass('img-responsive');
</script>
别忘了在html的head标签内加上：
<metaname="viewport" content="width=device-width, initial-scale=1">
这样在手机小屏幕上，图片也能够自动缩放了，同时不影响Bootstrap的自适应布局。.img-responsive属性其实也就是给图片加block，max-width:100%的属性。
以上所述是小编给大家介绍的Markdown与Bootstrap相结合实现图片自适应属性的相关知识，希望对大家有所帮助！
相关文章
在开发过程中,前端有时需要对后端返回的数据进行一些处理,当后端返回给我们json对象数组时,我们可能会需要按照对象中的某一个属性来进行分组,下面这篇文章主要给大家介绍了关于javascript数组按属性分组的实现方法,需要的朋友可以参考下2023-05-05
这篇文章主要为大家详细介绍了原生js实现表格循环滚动，每次滚动一行停顿，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-11-11
闭包在JavaScript高级程序设计(第3版)中是这样描述:闭包是指有权访问另一个函数作用域中的变量的函数,下面这篇文章主要给大家介绍了关于javascript解决闭包漏洞的一个问题的相关资料,需要的朋友可以参考下2022-11-11
下面小编就为大家带来一篇老生常谈原生JS执行环境与作用域。小编觉得挺不错的，希望对大家有所帮助。一起跟随小编过来看看吧，祝大家游戏愉快哦2016-11-11
这篇文章主要给大家介绍了JavaScript中使用Spread运算符的八种方法，文中通过示例代码介绍的非常详细，对大家学习或者使用JavaScript具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧2020-06-06
在本篇文章里小编给大家分享了关于JavaScript数据结构之栈实例用法内容，有兴趣的朋友们学习下。2019-01-01
使用JS前端加密库sm-crypto实现国密sm2、sm3和sm4加密与解密
这篇文章主要介绍了使用JS前端加密库sm-crypto实现国密sm2、sm3和sm4加密与解密,需要的朋友可以参考下2024-06-06
JavaScript中运算符规则的隐式类型转换是什么? 这是每个学习Javascript的新手们都应该知道的一个问题，下面这篇文章主要给大家介绍了关于JavaScript中运算符规则和隐式类型转换的相关资料，需要的朋友可以参考借鉴，下面来一起看看吧。2017-09-09
这篇文章主要为大家整理了关于Bootstrap排版的慕课笔记，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-03-03
JavaScript中基本数据类型和引用数据类型是如何存储的呢？下面通过本文给大家分享js数据类型的存储方法，需要的朋友参考下吧2017-08-08
最新评论