css - HTML/CSS 图像对齐

Question

我有这个代码：

<div id="mainDiv" style="text-align:center>
<img src="redFarm.jpg" style="width: 250px">
<img src="board.jpg" style="width: 750px">
<img src="blueFarm.jpg" style="width: 250px">
</div>

棋盘图像正好位于屏幕的中心。现在，另一个与尽可能多的中心对齐，我希望它们尽可能靠近边界（左和右）。我尝试了很多组合，但其中任何一个都没有运气。大家能给我指点一下吗？

谢谢

Answer 1

尝试左右浮动图像：

<div id="mainDiv" style="text-align:center">
<img src="redFarm.jpg" style="float:left; width: 250px">
<img src="board.jpg" style="width: 750px">
<img src="blueFarm.jpg" style="float: right; width: 250px">
</div>

这会将图像放在容器的顶部；如果这是一个问题，您可以尝试明确指定高度。