如何设置大小/旋转图像在哲基尔？

Question

如何在jekyll markdown中设置图像的大小？

![steam-fish-1]({{ "/assets/steam-fish-1.jpeg" | absolute_url }})

我在用Jekyll最低限度。使用

![steam-fish-1]({{ "/assets/steam-fish-1.jpeg" | absolute_url }} =250x)

在标记中更改图像大小是不起作用的。如果可能的话，我想知道如何旋转图像以及。

Answer 1

如果无法在Jekyll生成的HTML代码中包含大小/旋转属性（如图所示，请参阅注释）。。。CSS路线总是存在的。

请参见"用CSS按比例调整图像大小？"：您可以添加CSS样式表来设置图片的大小。甚至旋转它。

Answer 2

Markdown没有内置对图像大小的支持，因此唯一真正的解决方案是在Markdown中使用一点HTML。鉴于此，我的jekyll图像大小插件可以在不使用任何CSS的情况下进行所需的大小调整。

例子：

html prettyprint-override"><!-- template -->
{{ /assets/steam-fish-1.jpeg:img?width=250 alt='steam-fish-1' }}

<!-- output -->
<a href="/assets/steam-fish-1.jpeg" width='250' height='YYY' alt='steam-fish-1'>

（其中，YYY是图像的实际比例缩放高度。）

如果您需要绝对url筛选器：

<!-- template -->
<a 
  href={{ "/assets/steam-fish-1.jpeg" | absolute_url }} 
  {{ /assets/steam-fish-1.jpeg:props?width=250 }} 
  alt='steam-fish-1'
>

<!-- output -->
<a href="http://test.com/assets/steam-fish-1.jpeg" width='250' height='YYY' alt='steam-fish-1'>

对于旋转图像，仅旋转图像文件本身是否有意义？

Answer 3

杰基尔似乎接受属性列表。您可以按如下方式设置图像的大小：

![steam-fish-1](/assets/steam-fish-1.jpeg){: width="250" }

（或使用height=“250”）。属性值以像素为单位，并且（根据HTML规范）不应有显式单位。