1.使用简书自带的Markdown编辑器
原始图像:
![loading.png](http://upload-images.jianshu.io/upload_images/1503319-c696a9cd1495d68f.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
更改大小:
![loading.png](http://upload-images.jianshu.io/upload_images/1503319-c696a9cd1495d68f.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/200)
只需要将后面的宽度更改就可以了.这种改链接有效果的原因是因为服务器根据图片链接对原图进行了缩放并返回.这种方案需要服务器支持对图片链接的识别并进行对应的缩放.
(这种方法在编辑器上有效果,但发表出来后在页面上无效果,不知道为什么)
2.使用HTML <img>
标签并设置width和height
Markdown语法:
<img src="http://p1-ks3.532106.com/33f925f1f92649678221088fdfb531a1.jpg" alt="图片替换文本" width="500" height="313" align="bottom" />
只需要更改上面的属性width或height的值就可以了,align="bottom"
可以省略或根据需要设置其他值如top , bottom , middle , left , right
.
原始图像效果:
更改后
<img src="http://p1-ks3.532106.com/33f925f1f92649678221088fdfb531a1.jpg" alt="图片替换文本" width="100" height="30" align="bottom" />
效果:
<img src="http://p1-ks3.532106.com/33f925f1f92649678221088fdfb531a1.jpg" width="100" height="30" align="middle" />
我自己的博客系统是有效果的,但是不知道为啥这里的却渲染不出来.....
3.自己处理图片大小,重新生成图片链接
终极方案,无需考虑各大Markdown编辑器兼容性问题.
原始图像:
自己调整大小后的图片:
注意
每家的Markdown编辑器语法会有所不同,因此在一个编辑器下写的Markdown复制到另一家的编辑器下,显示可能会有差异.对于新手来说简书自带的Markdown编辑差不多已经够用了.