我有这个：
<html>
<head>
<title></title>
<meta http-equiv='Content-Type' content='text/html; charset=utf8'>
<style type='text/css'>
body {
background-color: #000;
}
</style>
</head>
<body>
<img src="1.jpg" height="100%" style="float: left;" />
<img src="2.jpg" height="100%" style="float: left;" />
<img src="3.jpg" height="100%" style="float: left;" />
<img src="4.jpg" height="100%" style="float: left;" />
</body>
</html>
这是大形象。但是我的浏览器并排显示了两个图像，并在换行中显示了两个图像。
我想将其全部显示在一行中。怎么做？
最佳答案
停止浮动图像，然后在正文或其他包装元素上设置white-space: nowrap。
body {
white-space: nowrap;
}
和：
<body>
<img src="1.jpg" height="100%" />
<img src="2.jpg" height="100%" />
<img src="3.jpg" height="100%" />
<img src="4.jpg" height="100%" />
</body>
演示：http://jsfiddle.net/ambiguous/4Udam/
关于html - 如何显示向左对齐的图像？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/8029221/