如何在HTML中的圖像上顯示動態值？

Question

我必須在頁面上顯示名稱和評級但我不知道如何做，任何建議或教程鏈接，如何開始？

Answer 1

圖像是用於顯示圖形數據的元素，不能向其中插入動態值，您可以通過CSS將它們疊加在圖像上，並且需要一些JavaScript來動態更改它們。我強烈推薦jQuery。

http://www.w3schools.com/css/

http://www.w3schools.com/jquery/

您可以使用這兩個更有效地

https://jsfiddle.net/

https://codepen.io/

測試代碼的這傢伙有一個基礎，一些不錯的視頻教程

https://www.youtube.com/watch?v=Mp0f0zTPLec&list=PL081AC329706B2953

Answer 2

嘗試是這樣的：

#image{width:100%; 
 
height:200px; 
 
    position:relative; 
 
    overflow:hidden; 
 
background:#454544; 
 
z-index:1;} 
 

 
#text{ 
 
color:white; 
 
position:absolute; 
 
top:10px; 
 
z-index:2; 
 
}

<div id="image"> 
 
    <img src="http://wallpaperwarrior.com/wp-content/uploads/2016/09/Wallpaper-15.jpg"> 
 
<div id="text"> 
 
    <h1>some text on the image</h1> 
 
    </div> 
 

 
</div>