Html Hình ảnh qua hình ảnh

Question

Bất kỳ ai cũng có thể cho tôi biết cách tôi có thể thêm hình ảnh lên hình ảnh khác mà không sử dụng Z-index hoặc Z-order?

Answer 1

Khó trả lời đúng mà không biết chính xác những gì bạn muốn đạt được, z-index có lẽ không phải là những gì bạn thực sự cần. Ví dụ sau đây sẽ làm việc:

<div id="container"> 
    <img src="img1.jpg" id="img1" /> 
    <img src="img2.jpg" id="img2" /> 
</div> 

#container { 
    position:relative; 
} 

#img2 { 
    position: absolute; 
    left: 50px; 
    top: 50px; 
} 

Cũng dù bạn sử dụng <img> thẻ hoặc background-images phụ thuộc vào valueOf ngữ nghĩa những hình ảnh, ví dụ là họ nội dung presentational hoặc actualy trang?

Answer 2

Đặt hình nền hình ảnh chính trong CSS với background-image tài sản

Answer 3

Cách đơn giản nhất là để đảm bảo chúng đều cùng kích thước, người ta minh bạch, và bạn sử dụng đoạn mã này:

<img style="background:url(image.jpg)" src="overlay_image.gif" alt="" /> 

Answer 4

Bạn cũng có thể sử dụng văn bản qua hình ảnh bằng cách sử dụng đoạn mã sau:

<TABLE BORDER="0" cellpadding="0" CELLSPACING="0"> 
    <TR> 
    <TD WIDTH="221" HEIGHT="300" BACKGROUND="samplepic.jpg" VALIGN="bottom"> 
     <FONT SIZE="+1" COLOR="yellow">Sample Text</FONT> 
    </TD 
    </TR> 
</TABLE> 

Hy vọng rằng sẽ giúp.