更改嵌入式img元素，使其像塊元素一樣行動

我對這個世界很陌生，但是很喜歡它。請原諒我的新手地位，如果我問一些荒謬的問題，或者如果事情發佈不正確。請根據您的意見提供建議。更改嵌入式img元素，使其像塊元素一樣行動

我試圖讓一個按鈕漂浮在圖像上。我將圖像作爲內聯元素引入，以便我可以在Dreamweaver中保留PSD鏈接，而不是將其作爲背景圖像和alt屬性應用程序。我猜測問題是我想要內聯圖像作爲一個塊？是對的嗎？我已經可以使用按鈕的相對位置和圖像的絕對位置來使按鈕浮動在圖像上，但是無法將整個事物置於頁面上。任何建議你都非常感謝！

CSS

#container { 
    margin: auto; 
    display: block; 
} 

#button { 
    width: 100px; 
    height: 100px; 
    background-color: blue; 
    float: left; 
    position: relative; 
}

HTML

<body> 

    <div id="container"><img src="index.jpg" width="1200" height="900" /></div> 

    <div id="button"></div> 

</body>

來源

2013-10-01 user2833079

你想在圖像上的藍色背景 - 所有這一切都是在屏幕上居中？ – jbrya029

移動你的按鈕DIV內容DIV中：

<div id="container"><img src="index.jpg" width="1000" height="900" /><div id="button"></div></div>

，然後改變你的容器中的寬度你的公司ntent。位置設置爲相對。然後，將按鈕定位在容器div中絕對，頂部和左側。

#container { 
margin: auto; 
display: block; 
width:1200px; 
position:relative; 
} 

#button { 
width: 100px; 
height: 100px; 
background-color: blue; 
position: absolute; 
top:0px; left:20px; 
}

來源

2013-10-01 01:07:59 jbrya029

更改嵌入式img元素，使其像塊元素一樣行動

回答

相關問題