Typora_Markdown_图片标题(题注)

Typora_Markdown_图片标题(题注)

总体有两种方法，一种是简单粗暴的,直接在图片下加文字作标题，而另一种是封装可拓展性强。

1. 直接下加标题

效果如下，下图即为在Typora中该做法的效果，还是可以达到预期的效果，标题在图片正下方，但由于是默认图片显示和自加html标题，二者分开编程，在Typora中显示略有逊色，标题和图片会有隔一行的感觉，让人觉得标题和图片贴合度不高，不够排版美观。

<center><p>这里放标题</p></center>

代码如下：

<img src="这里放图片路径"
     alt="这里放图片显示不出的时候出现的文字"
     style="zoom:这里写缩放的百分比，比如:30%"/>
<center><p>这里放标题</p></center>

2 封装型

封装型效果如下，整个html代码在一起没有分开，整个代码要自己写。但从下图可以看出，在Typora的显示中，图片和标题(题注)贴合性高，整体感觉比直接下加标题的方法更美观。

代码如下：

<div>			<!--块级封装-->
    <center>	<!--将图片和文字居中-->
    <img src="图片路径放这里"
         alt="无法显示图片时显示的文字"
         style="zoom:这里写图片的缩放百分比"/>
    <br>		<!--换行-->
    这里是图片的标题	<!--标题-->
    </center>
</div>