空間使用的z-index

.games_box 
    { 
    width:575px; 
    margin:8px auto; 
    background:#f8f7f7; 
    padding:8px; 
    border-bottom:#000000 1px dotted; 
    } 

<div class="games_box"> 
<a href='#'> 
<img src='$host_name/staff/game-$row[0].gif' width='78' height='75' alt='games' /> 
    <div id='staff' style='position:relative; top:-50px;z-index:1; left:29px'> 
<img src='images/staff_picks.png' alt='staffpick' width='50' height='51' /></div> 
</a> 
</div>

我把工作人員的div ..遊戲盒DIV大.. 我使用 '明確：既' ..但沒有用..空間使用的z-index

1日

enter image description here

第二

地方人員拾取圖像

place staff pick image

第三

最後，z-index的使用staffpick圖像，根據圖像更多的空間

enter image description here

來源

2012-04-13 Vaishu

你能解釋一下究竟你需要或向我們展示了小提琴或顯示截圖.... – 2012-04-13 06:04:45

我已經表明截圖.. – Vaishu 2012-04-13 06:53:24

嗨，你可以給父母地位相對和孩子給予絕對是這樣

Css

.games_box 
    { 
    width:575px; 
    margin:8px auto; 
    background:#f8f7f7; 
    padding:8px; 
    border-bottom:#000000 1px dotted; 
    position:relative; 
    }

HTML

<div class="games_box"> 
<a href='#'> 
<img src='$host_name/staff/game-$row[0].gif' width='78' height='75' alt='games' /> 
    <div id='staff' style='position:absolute; top:-5px;z-index:1; left:29px'> 
<img src='images/staff_picks.png' alt='staffpick' width='50' height='51' /></div> 
</a> 
</div>

現場演示http://jsfiddle.net/rohitazad/grE5A/

來源

2012-04-13 05:32:46

我會努力這段代碼15分鐘後 – Vaishu 2012-04-13 05:50:07

我已經改變了CSS和職員股風格..工作人員挑選不可見。我只需要在工作人員挑選圖像的基礎圖像.. – Vaishu 2012-04-13 06:23:06

您的代碼和我設置工作人員div寬度，高度..其工作..謝謝 – Vaishu 2012-04-13 08:48:22

爲了 '吸起來的空間'，您可以使用margin-top:-50px;或在這個例子中http://jsfiddle.net/grE5A/2/使用position:absolute等。

通知我已經給<a>標籤的相對位置，因爲它是「父」是#staff必須在絕對定位。

你有圖像下方的空間，就是因爲position:relative; top:-50px移動工作人員相對於其原始位置進行拾取，但父母仍然表現爲元素處於其原始位置。（Z-指數沒有影響你正在嘗試做的。）

來源

2012-04-13 07:35:34 brains911

回答

相關問題