將一個元素使用CSS

3號線後，我有這樣的HTML代碼：將一個元素使用CSS

<style> 
    .ad { margin: 15px; height: 30px; background-color: #7f7f7f; } 
    .article { width: 300px; font-size: 24px; line-height: 30px; border: 1px solid; } 
</style> 
<div class="ad"></div> 
<div class="article"> 
    asd asd asd asd asd asd asd asd 
    asd asd asd asd asd asd asd asd 
    asd asd asd asd asd asd asd asd 
    asd asd asd asd asd asd asd asd 
    asd asd asd asd asd asd asd asd 
    asd asd asd asd asd asd asd asd 
    asd asd asd asd asd asd asd asd 
    asd asd asd asd asd asd asd asd 
</div>

我想在文章內的廣告，但我想一直成爲第三和第四線之間。這可能只使用CSS？如果沒有，有什麼辦法可以使用Javascript或PHP來實現這一點？我在PHP中有一個字符串中的文章，但我不知道第三行在哪裏。

請注意，該文章是HTML格式，可能包含HTML標記，所以我不能計算字符。此外，.ad標記可以位於.article標記之前或之後。

在此先感謝您的寶貴幫助！

來源

2015-11-01 ilias_gr

你不得不打破自己的文章，以使廣告放置正確。 – Sachin

文章從500多個RSS源自動導入，並且它們的佈局不相同。您能否建議我採用自動方式在第三行之後放置廣告？ –

我想，你可以嘗試破解數據，然後..例如，設置'.article'後，獲取設置在其中的文本（不是html）並獲取設備寬度。然後嘗試找出文本中第三行的結尾並添加一個「div」。然後，您可以將廣告放入您添加的新「div」中。 – Sachin

在html中，您不能轉到Enter key的下一行，換行符標記是<br>在html中。所以，你的代碼必須是這樣的：

<div class="article"> 
    asd asd asd asd asd asd asd asd<br> 
    asd asd asd asd asd asd asd asd<br> 
    asd asd asd asd asd asd asd asd<br> 
    asd asd asd asd asd asd asd asd<br> 
    asd asd asd asd asd asd asd asd<br> 
    asd asd asd asd asd asd asd asd<br> 
    asd asd asd asd asd asd asd asd<br> 
    asd asd asd asd asd asd asd asd<br> 
</div>

您可以使用jQuery找到第3行，並添加您的ad格：

$(".article br:nth-child(3)").after('<div class="ad"></div>');

來源

2015-11-01 09:53:03

我知道這一點。但我的問題是不同的！該文章在一行中，並自動換行。 –

將一個元素使用CSS

回答

相關問題