Markdown图片大小对齐边框

markdown主要是文档的快速排版, 如果要精细的布局和多样的样式, 可以通过HTML标记语言来实现。本文代码及效果适用于typora，且注意一切符号用英文半角。

一、左右对齐

图片可以用<img>中align标签或者style设置样式实现对齐方式.

<img src='图片地址' align='right' style=' width:300px;height:100 px'/>
<img src='图片地址' style='float:right; width:300px;height:100 px'/>

align标签：

值	描述
left	左对齐内容。
right	右对齐内容。
center	居中对齐内容。
justify	对行进行伸展，这样每行都可以有相等的长度（就像在报纸和杂志中）

二、修改边框

1、普通效果：
BORDER-RIGHT:#007979 5px solid
BORDER-TOP、BORDER-BOTTOM、BORDER-LEFT、BORDER-RIGHT分别表示上、下、左、右边框，其属性值#007979、5px、solid分别表示该边框的颜色、宽度及边框类型（solid为实线边框），可根据需要而改变。

image.png

2、特别效果：

前后对比
把下面代码加入到style里即可
border-radius:3px; box-shadow:rgba(0,0,0,0.15) 0 0 8px;background:#FBFBFB;border:1px solid #ddd;margin:10px auto;margin-left: 15px;padding:5px;

三、总结

<img src='图片地址' align='right' style=' width:300px;height:100px 
BORDER-RIGHT:#007979 5px solid；
BORDER-TOP:#007979 5px solid；
BORDER-LEFT：#007979 5px solid；
BORDER-BOTTOM:#007979 5px solid；
'/>

为方便查看，加了换行，使用时需去掉。图片右对齐，宽300px，高100px,上下左右各加5px实线边框（颜色HEX为#007979）

参考文章

1、markdown中怎么让图片靠左或靠右对齐
2、用HTML代码给图片添加边框方法
3、CSS 为图片 增加边框效果
4、html标签