Markdown 编辑器如何修改图片大小

148 字

1 分钟

Markdown 编辑器如何修改图片大小

2026-03-31

技术专栏

Markdown

教程

文档编辑

前端开发

方法一、嵌入HTML代码#

1.1 使用 img标签#

1
<img src="./xxx.png" width = "300" height = "200" alt="图片名称" align=center />

1.2 如果需要居中的话只要在外面包围div标签即可#

1
<div align="center"> ... </div>

方法二、直接在图片后面加上对应的CSS样式即可#

1
![test image size](url){:class="img-responsive"}
2
![test image size](url){:height="50%" width="50%"}
3
![test image size](url){:height="100px" width="400px"}

方法三、一劳永逸通用思路#

在文章头部添加：

1
<style>
2
img{
3
    width: 60%;
4
    padding-left: 20%;
5
}
6
</style>

这个对文章所有图片都有效，如果图片尺寸标准差异过大，建议还是用单独的标签来定义。

Markdown 编辑器如何修改图片大小

https://fuwari.vercel.app/posts/markdown系列markdown-编辑器如何修改图片大小/

作者

Watch Your Back

发布于

2026-03-31

许可协议

CC BY-NC-SA 4.0

常见电脑架构与软件选择指南

如何在 Fuwari 博客页脚添加 ICP 备案及运行时间

方法一、嵌入HTML代码

1.1 使用 img标签

1.2 如果需要居中的话只要在外面包围div标签即可

方法二、直接在图片后面加上对应的CSS样式即可

方法三、一劳永逸通用思路