0. 前言

最近写 md 文章的时候发现,在 markdown 里插入一些很长的图片的时候,会显得很不好看,于是去查了一下如何实现 markdown 里图片的并排显示,参考了各个博客内的内容和 markdown 文档,了解 markdown 支持一些 html 的标签,下面用 <img> 实现对图片的简单处理。

1. 单张居中显示

123456789
<center>    <img src="http://dreamofbook.qiniudn.com/Zero.png"></center>

OR

<figure>    <img src="http://xxx.jpg"></figure>

2. 固定图片宽度 / 高度:

<img src="http://xxx.jpg" title="Logo" width="100" />

宽度是 Width,高度是 High。Title 为图片描述。

3. 两张并排显示:

123
<figure class="half">    <img src="http://xxx.jpg"><img src="http://yyy.jpg"></figure>

4. 三张并排显示:

123
<figure class="third">    <img src="http://xxx.jpg"><img src="http://yyy.jpg"><img src="http://zzz.jpg"></figure>

5. 固定宽度,并排显示并居中

就是把上面的几个例子和起来,下面给出代码

123
<center class="half">    <img src="http://xxx.jpg" width="300"/><img src="http://yyy.jpg" width="300"/></center>

2019-05-03

Markdown 图片的简单处理的更多相关文章

  1. Markdown 图片助手-MarkdownPicPicker

    title: Markdown 图片助手 v0.1 toc: true comments: true date: 2016-06-04 16:40:06 tags: [Python, Markdown ...

  2. thinkPHP5.0框架验证码调用及点击图片刷新简单实现方法

    这篇文章主要介绍了thinkPHP5.0框架验证码调用及点击图片刷新简单实现方法,结合简单示例形式分析了thinkPHP5框架验证码相关配置.后台验证.前台刷新等操作技巧,学习thinkphp源码的朋 ...

  3. Github Markdown 图片如何并排显示

    Github Markdown 图片如何并排显示   要一张图片接着一张图片的写,中间不能有换行.如果换行的话则图片也换行 正确的写法: ![描述](图片链接)![描述](图片链接)![描述](图片链 ...

  4. markdown图片转换demo

    markdown图片转换demo 一直以来都是用Markdown来写博客的,但是它的图片嵌入实在是太让人头秃,逼得我能找网上的图片就不用自己的,实在是麻烦.所以我在发现了一个可以生成markdown样 ...

  5. u-tools图床便捷生成markdown图片

    u-tools 图床 上传图片生成markdown图片非常便捷. 支持的图片服务器有几种,其中搜狗.网易和掘金的加载速度更快些: 也可以用阿里与和腾讯云的OSS; 其中网易生成图片不是原图尺寸好像被改 ...

  6. 如何实现一个 markdown 图片粘贴上传的博客后台系统

    如何实现一个 markdown 图片粘贴上传的博客后台系统 js 实现 drag & drop / copy & paste image uploader MongoDB 设计文档对象 ...

  7. 调整markdown 图片大小和对齐方式

    [博客园]调整markdown 图片大小和对齐方式 图片大小 例 <img src="https://img2020.cnblogs.com/blog/2199257/202101/2 ...

  8. Hexo + VSCode 插入 Markdown 图片解决办法

    最近打开 typora 时发现弹窗强更,不让用 beta 版了 想到自己并不是非常需要 WYSIWYG,而且也不是经常使用 typora,于是直接退回到 VSCode 了,而且在 VSCode 里可以 ...

  9. LZ77压缩算法编码原理详解(结合图片和简单代码)

    前言 LZ77算法是无损压缩算法,由以色列人Abraham Lempel发表于1977年.LZ77是典型的基于字典的压缩算法,现在很多压缩技术都是基于LZ77.鉴于其在数据压缩领域的地位,本文将结合图 ...

随机推荐

  1. Docker pull下载出现 error pulling image configuration:

    出现这个问题,并且在错误信息的最后附带 net/http: TLS handshake timeout: 猜测是docker的相关配置问题,导致无法通过TLS握手 执行如下命令修改配置 echo &q ...

  2. 《基于Scyther的秘钥建立协议设计》-------摘抄整理

    本篇论文额主要创新点:   利用Scyther软件,通过对一个不安全的秘钥建立协议逐步添加并验证安全属性,最终建立一个安全的秘钥建立协议. 通过形式化分析软件设计秘钥建立协议课可以提高协议设计效率,减 ...

  3. nmap中文帮助文档

    简介: Nmap(“ Network Mapper ”)是用于网络探索和安全审核的开源工具.它设计用于快速扫描大型网络,尽管它可以在单个主机上正常运行.Nmap以新颖的方式使用原始IP数据包来确定网络 ...

  4. 我用Python爬虫挣钱的那点事

    在下写了10年Python,期间写了各种奇葩爬虫,挣各种奇葩的钱,写这篇文章总结下几种爬虫挣钱的方式. 1.最典型的就是找爬虫外包活儿.这个真是体力活,最早是在国外各个freelancer网站上找适合 ...

  5. CodeForces 768E SG函数 整数划分 Game of Stones

    一个标准的NIM游戏 加上一条规则:每堆石子对于每个数目的石子只能被取一次 可以SG打表 dp[i][j]表示现在有i个石子 j是可以取的石子数的状压 第i位为1就表示i个石子没被取过 #includ ...

  6. Python多线程应用于自动化测试

    Python多线程应用于自动化测试 将多线程在测试巧妙地应用,确实会带来很多好处,并且这是充分利用机器资源执行高效率测试很好的方式 # -*- coding: utf-8 -*- import thr ...

  7. MVVM框架-MVVMLight

    项目URL:http://www.mvvmlight.net/ 一.安装MVVMLight 在NuGet程序包中搜索MVVMLight,然后安装. 二.使用 安装完MVVMLight后项目中会自动生成 ...

  8. python学习之文件读写,序列化(json,pickle,shelve)

    python基础 文件读写 凡是读写文件,所有格式类型都是字符串形式传输 只读模式(默认) r  f=open('a.txt','r')#文件不存在会报错 print(f.read())#获取到文件所 ...

  9. 将自己写的组件封装成类似element-ui一样的库,可以cdn引入

    在写好自己的组件之后 第一步 修改目录结构 在根目录下创建package文件夹,用于存放你要封装的组件 第二部 在webpack配置中加入 pages与publicpath同级 pages: { in ...

  10. 如何python循环中删除字典元素

    //下面这行就是在循环中遍历删除字典元素的方法! for i in list(dictheme2.keys()): if dictheme2[i]<self.countFortheme: dic ...