讓Jekyll img比文字更寬廣？

Question

對於我的傑奇的博客，我希望圖像跨越塔的整個寬度，同時對文本的兩側填充，這樣的：http://www.webdesignerdepot.com/2015/05/the-ultimate-guide-to-web-animation

時遇到的主要問題是哲基爾包裝圖片在<p>標籤，所以沒有辦法（我知道）的目標圖像的寬度，而不是段落。

<p> 
    "Some text." 
</p> 
<p> <img src="#"> </p> 

你會如何解決這個問題？

Answer 1

我認爲戴維斯的回答非常好。但是，如果你沒有問題解決這個與jQuery，你可以這樣做：

$('.content > p > img').parent().css('padding','0'); 

這樣你的減價將保持乾淨。

Answer 2

我知道您正在使用markdown編寫您的帖子/頁面。

爲了將特定樣式應用於P容器，您可以使用kramdown block attributes在其上設置類。

Some test 

![Alt text](/path/to/img.jpg) 
{: .imgContainer} 

將呈現爲

<p>Some test</p> 

<p class="imgContainer"><img src="/path/to/img.jpg" alt="Alt text" /></p> 

然後，您可以風格.imgContainer。

Answer 3

您也可以選擇創建一個HTML塊。這是通過這樣一個div包裝img標籤來完成：

line 

<div><img src="image.jpg" /></div> 

line 

不乾淨的降價，而是一個非常乾淨的解決方案不過。找到解決方案here。