如何最好地覆蓋圖像上的畫布？

Question

我想將一個畫布放在頁面上的圖像上。畫布將成爲圖像的確切尺寸。

但是，下列條件必須滿足：

• 畫布必須始終在圖像的頂部仍然正是。因此，使用絕對定位不起作用，因爲如果將內容插入到圖像上方，則會將圖像向下移動而不移動畫布。
• 圖像可能會從其原始大小調整大小。因此，用畫布替換圖像並將其背景設置爲圖像將不起作用。

我有什麼選擇？

Answer 1

您應該能夠使用position:relative而不是絕對的第一個要求。

對於第二我猜你可以把圖像和畫布都放在一個跨度內。畫布的寬度/高度爲100％，並且會在圖像調整大小時調整大小，因爲div的大小會更改爲適合圖像。

編輯：其實我不知道position:relative會工作。但我相信如果你使用position:absolute而父元素有position:relative，絕對位置將會相對於父類。