如何放置兩個畫布圖像上相互

Question

我有他們兩個canvas.One是一個房間，另一個的畫面是chair.I的圖片有兩個問題：一是 ：如何把這些兩個畫布上的圖像彼此？ 二：它包含了房間的形象我的第一個帆布寬約7米的椅子是80cm左右的width.By它不是images.It的大小是他們view.How大小的方式，我應該把根據第一個第二個？

感謝

Answer 1

我不知道爲什麼你保持引用到「畫布」上，因爲我不明白爲什麼你需要的畫布時，你可以使用圖片，但你可以只使用position: relative;您父元素，然後在你的子元素position: absolute;，例如：

<div class="canvas"> 
    <img class="canvas__item" src="images/room.jpg" alt="The room"> 
    <img class="canvas__item canvas__item--chair" src="images/chair.jpg" alt="The chair"> 
</div> 

或者，如果使用<canvas>元素（我不能沒有任何代碼告訴你的問題）：

<div class="canvas"> 
    <canvas class="canvas__item canvas__item--room"></canvas> 
    <canvas class="canvas__item canvas__item--chair"></canvas> 
</div> 

而在你的CSS：

.canvas { 
    position: relative; 
    width: 720px; /* Define the width of your main image, in your case the "room" */ 
    height: 460px; /* Define the height of your main image, in your case the "room" */ 
} 

.canvas__item { 
    position: absolute; 
}  

.canvas__item--room { 
    top: 0; 
    left: 0; 
} 

.canvas__item--chair { 
    top: 10px; /* Define the offset position of your chair image here */ 
    left: 80px; /* Define the offset position of your chair image here */ 
    width: 60px; /* Define the width of your chair image here */ 
    height: 180px; /* Define the height of your chair image here */ 
}