我刚开始接触Markdown。我喜欢它,但有一件事困扰着我:如何使用Markdown更改图像的大小?
文档仅为图像提供以下建议:
![drawing](drawing.jpg)
如果可能的话,我希望图片也居中。我问的是Markdown将军,而不仅仅是GitHub是如何做到的。
我刚开始接触Markdown。我喜欢它,但有一件事困扰着我:如何使用Markdown更改图像的大小?
文档仅为图像提供以下建议:
![drawing](drawing.jpg)
如果可能的话,我希望图片也居中。我问的是Markdown将军,而不仅仅是GitHub是如何做到的。
当前回答
代替[title](imageurl.type)与<img src=“https://image-url.type“width=”200“height=”200“/>
其他回答
有添加类和css样式的方法
!〔pic〕〔logo〕{.classname}
然后在下面写下链接和css
[logo]: (picurl)
<style type="text/css">
.classname{
width: 200px;
}
</style>
此处引用
如果我们只是像这样使用普通的HTML图像标记,那么它是有效的,如果您使用引导来进行样式设置。我在Jekyll制作的网站上使用这个。
<img class="img-fluid" src="./img/face.jpg" alt="img-verification">
如果我们按照这个例子添加引导类,它会很好地工作。
对于IntelliJ IDEA用户,请参阅Markdown Navigator插件。
预览渲染图像、徽章、HTML等。
对于某些Markdown实现(包括Mou和Marked 2(仅限macOS)),您可以在图形文件的URL后添加=WIDTHxHEIGHT以调整图像大小。不要忘记=前面的空格。
![](./pic/pic1_50.png =100x20)
您可以跳过高度
![](./pic/pic1s.png =250x)
和宽度
![](./pic/pic1s.png =x250)
在Tiemes答案的基础上,如果您使用CSS 3,可以使用子字符串选择器:
此选择器将匹配以“-fullwidth”结尾的alt标记的任何图像:
img[alt$="-fullwidth"]{
width: 100%;
display: block;
}
然后,您仍然可以使用alt标记来描述图像。
上面的标记可能类似于:
![Picture of the Beach -fullwidth](beach.jpg)
我在Ghost markdown中使用过这个,而且效果很好。