我是这个世界的新手，但我如此热爱它。如果我提出荒谬的问题或者发布的内容不太正确，请原谅我的新手身份。请提出您认为合适的建议。
我想让一个按钮漂浮在图像上。我将图像作为内联元素引入，这样我就可以在 Dreamweaver 中保留 PSD 链接，而不是将其作为背景图像引入并用于 alt 属性应用程序。我猜问题是我想让内联图像充当 block ？是对的吗？我已经能够使用按钮的相对定位和图像的绝对定位让按钮漂浮在图像上，但是我无法将整个内容放在页面的中心。非常感谢您的任何建议!
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>
最佳答案
将按钮 div 移到内容 div 中:
<div id="container"><img src="index.jpg" width="1000" height="900" /><div id="button"></div></div>
然后将您的容器更改为内容的宽度。位置设置为相对。然后，使用 absolute、top 和 left 将按钮定位在容器 div 中。
#container {
margin: auto;
display: block;
width:1200px;
position:relative;
}
#button {
width: 100px;
height: 100px;
background-color: blue;
position: absolute;
top:0px; left:20px;
}
关于html - 将内联 img 元素更改为像 block 元素一样，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19106283/