2016-06-11 101 views
-1

有沒有辦法設置一個背景圖像以適應另一個圖像? 這個例子可以解釋這一切:CSS:在另一個圖像(或畫布)內的背景圖像

enter image description here

+0

你可以有多個背景圖像規則在同一個元素上,所以是的。 – Kaiido

+0

**不,該圖像沒有充分解釋!**圖像很少會與講話泡泡完全吻合。當它不是一個完全適合它必須縮放。當它被縮放時,幾乎總會有溢出或下溢。上溢或下溢需要做什麼? – markE

回答

0

這應該這樣做,假設你的PNG有一個透明部分。如果您可以使圖像尺寸正確,則第一個選項將起作用。第二個選項確保一個左對齊,第二個對齊右對齊。根據您的要求,您可能需要將填充添加到第二張圖片,並可能將其縮放到正確的大小。

comment {background-image: url("bubble.png"), url("people.png");} 

或多個控制

comment { 
     background-image: url("bubble.png") left top no-repeat, url("people.png") right top no-repeat; 
    } 
與插入的圖像偏移,像素尺寸爲

現在:

comment { 
     background-image: url("bubble.png") left top no-repeat, url("people.png") left 30px top 20px/300px 200px no-repeat ; 
    } 

詳細內容見css3.com

+0

但第二個會在另一個裏面嗎? – MultiformeIngegno

+0

修訂示例 - 您需要在圖像中有一個透明部分。如果您無法控制插入圖像的圖像尺寸,則可能會進行FUN調試! – Mike

+0

嚴.. https://jsfiddle.net/cypgLf0b/ – MultiformeIngegno