Html在圖像的底部放置一個標籤

大家好我是新手，在這個軟件世界裏，現在我有一個問題，我需要在圖像底部放置一個標籤，我認爲我可以做到這一點，但隨着時間的我決定把我的問題後，在這個網站上，一個方向我的想法是創建一個HTML數據表Y放標籤img的，但後來我的問題是我怎麼可以把一個標籤在標籤img的Html在圖像的底部放置一個標籤

<table border="2px"> 
     <td><img src="tiquet.png" height="150" width="90"></td> 
</table>

我找不到用於在圖像底部放置標籤的HTML標籤，然後我想在另一個表格中放入另一個表格，但我認爲這不是一個好主意，因爲我如何將標籤與底部圖片做你有一些想法可能對我很有幫助。

來源

2016-05-29 user2957682

通過標籤你的意思是標題，對不對？ – kkaosninja

是的，我需要知道如何在這張圖片上放一些文字 – user2957682

發表了答案。看一看。 :-) – kkaosninja

您可以使用<figure>和<figcaption>元素來達到所需的效果。您可以使用一些CSS來設置figure元素的邊框寬度。

<figure> 
    <img src="tiquet.png" height="150" width="90"> 
    <figcaption>Your label goes here</figcaption> 
</figure>

來源

2016-05-29 06:23:04 kkaosninja

謝謝，疊加文字在圖像看起來像一個文本的單個圖像，它就像一張票和上面的文本，將是一個價格，所以我需要創建這個效果 – user2957682

在這種情況下，這個答案不適用。你可以看看這裏=> https://css-tricks.com/text-blocks-over-image/ – kkaosninja

謝謝你，我會嘗試這個解決方案 – user2957682

嘗試如下

HTML： -

<a href="http://name.com"> 
     <img src="name.png" width="100px" height="100px"> 
     <div class="caption">Caption here</div> 
    </a>

CSS： -

#images{ 
    text-align:center; 
    margin:50px auto; 
} 
#images a{ 
    margin:0px 20px; 
    display:inline-block; 
    text-decoration:none; 
    color:black; 
}

來源

2016-05-29 06:23:45

謝謝，疊加文字在圖像看起來像一個單一的圖像與文本，它就像一張票和上面的文本將是一個價格，所以我需要創建這種效果 – user2957682

Html在圖像的底部放置一個標籤

回答

相關問題