2012-11-23 98 views
0

我想使用HTML並顯示一個大圖像。 在這個大的圖像上,我希望顯示多個更小的圖像,所有圖像都在不同的地方和尺寸上。如何在HTML中的多個圖像上顯示多個圖像

我寧願只用HTML來做這個。 但是,如果這是不可能的,Javascript或類似的東西也是一個選擇... :-) 如果任何人有任何想法使用PHP,那也將是偉大的。

我有搜索網站和StackOverflow,並嘗試了很多可能的解決方案,但沒有一個允許我顯示一個大的圖像,然後在這個大圖像上顯示多個其他圖像。

任何幫助將不勝感激。

親切的問候, 邁克爾

+1

您是否嘗試過的CSS和的z-index +絕對位置? –

+0

如果您的問題已解決,請將其中一個答覆標記爲答案。刻度線對應於答覆。 – Nitish

回答

0

你不能覆蓋對另一圖像的圖像中唯一的純HTML,但你可以做的是重新定位圖像的位置到另一個標籤,只是用CSS移動它相應。

+0

您是否建議CSS不是「純粹的」html? img的絕對定位是沒有問題的。 – jtheman

+0

好吧,我的壞,我包括CSS + HTML作爲一件事,但你是對的,一旦你使用CSS不是HTML既不是HTML –

0

兩種選擇:

  1. 定義爲中使用CSS背景的大圖片,然後你就可以把它上你要任何HTML標記。這種backgorund也可以爲像div這樣的元素聲明,不僅適用於整個頁面。

  2. 在你的風格定義中使用絕對定位。這樣,您可以將大大小小的圖像添加到您的標記中,然後將它們放在彼此的頂部。

沒有javascript需要這個和php沒有任何關係。

0

你可以放置它們,因爲我在這的jsfiddle做了:http://jsfiddle.net/xxUpk/

top:-NNNpx是原油,你可以使用float許多他們定位的其他方式。同時查看z-index來對它們進行分層。

2

您可以使用容器div來包含所有較小的圖像。您可以設置該特定div的背景。

你的HTML作爲

<div id="container"> 

</div> 

和css如下:

​​