MarkDown readme图片尺寸固定且居中

本文介绍了在Markdown中展示图片的不同方法,包括使用HTML标签调整图片大小和位置等实用技巧。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

GitHub地址:https://github.com/youlookwhat

CSDN博客:http://blog.csdn.net/jingbin_

首先看一下显示效果:

居中显示

有时候为达到美好的排版方式,我们会有多种显示图片的需求,现在我们来依次试试


显示图片的方式有这样几种:

1.引入HTML,格式如下:
![](img_url)

“[]”里放的是图片描述文字。这样图片就会靠在左侧,大小也不由自己决定,例如:

![图片描述文字](http://img.blog.csdn.net/20161028230559575)

图片描述文字

2.固定图片显示大小:

你是不是觉得以上的图片不是你想要的尺寸呢,没关系,你可以自定义尺寸:

<img width="150" height="150" src="https://img-blog.csdn.net/20161028230559575"/>

分别在“width”和“height”设置你想要的宽高就好了,就成这样:

你也可以加上描述文字就是这样:

<img src="https://img-blog.csdn.net/20161028230559575" width="150" height="200" alt="图片描述文字"/>
3.固定图片显示大小且居中:

这时候想到也许居中会更好,于是我们试试居中

<div align=center><img width="150" height="150" src="https://img-blog.csdn.net/20161028230559575"/></div>

只要在外面包围div标签就好了,就是这样显示了:

如果觉得满意请顶一下哦,thanks~

### 创建或编辑README文件的Markdown语法 README 文件通常用于描述项目的内容、功能以及安装方法等重要信息。以下是关于如何使用 Markdown 语法来创建或编辑 README 文件的关键点: #### 基本文本格式化 可以利用 Markdown 提供的功能对文档中的文字进行样式控制,比如加粗或者斜体显示。通过简单的标记符实现这些效果是非常直观的。例如,要使一段文字变为 **加粗** 可以将其包裹在双星号 `**` 中[^1]。 对于 *斜体* 文字,则只需单个星号 `*` 即可完成设置。 #### 列表构建 列表也是 README 文件中常见的元素之一。无序列表可以通过星号 `*` 或者减号 `-` 来定义每一项;而有序列表则需采用阿拉伯数字加上英文句点的形式表示顺序关系。 ```markdown - Item one - Item two - Nested item A - Nested item B ``` 上述代码片段展示了嵌套式的无序列表结构。 #### 插入链接与图片 为了增强文档的信息传递能力,还可以加入超链接和图像资源。链接书写方式如下所示: `[Link Title](URL)` ,其中 Link Title 是展示给用户的可见名称,URL 是实际指向的目标地址。 至于插入图片,其语法规则是类似的,只是前面多了一个感叹号 `!` : `![Alt Text](Image URL)` 。这里的 Alt Text 应该是对这张图简单明了的文字说明,在无法加载图片的情况下提供替代信息。 #### 使用工具预览效果 如果希望即时查看所编写 Markdown 的渲染结果,可以借助某些命令行工具如 Algernon 并附加特定参数运行程序来进行快速浏览操作[^2]。 另外,在一些集成开发环境 (IDE) 或专门的应用软件里也可能内置有实时预览面板支持 Markdown 编辑器组件配置选项,这有助于更高效地调整布局设计直至满意为止[^3]。 最终记得保存您的工作成果为 `.md` 扩展名文件形式以便于版本控制系统识别处理并分享出去让更多人受益于此清晰易读的技术文档!
评论 8
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值