在网页设计中，尤其是在响应式设计中，布局元素的显示方式对于适应不同的屏幕尺寸和设备类型至关重要。Inline-block 和 float:left 都是用来排列元素的 CSS 属性，但它们的表现和适用场景有所不同。

1. **display: inline-block**
- 元素水平排列，且元素之间会像文本一样产生空白（white space）。
- 每个元素都占用一行，除非设置了宽度（width），否则它们会根据内容自适应宽度。
- 可以通过设置 vertical-align 属性来调整元素的垂直对齐方式。
- 可以设置 margin 和 padding，但它们会影响相邻元素之间的间距。
- 不适用于需要严格对齐的布局，因为空白字符（例如空格和换行符）会改变布局。

2. **float: left**
- 元素向左浮动，直到其边缘碰到包含框的边缘或另一个浮动元素的边缘。
- 浮动元素会脱离文档的常规流，这意味着它不会影响常规流中其他元素的位置。
- 可以通过设置 right 来使元素向右浮动。
- 浮动元素的宽度通常需要显式设置，因为它不会自动适应内容。
- 可以通过 clear 属性来清除浮动的影响。
- 浮动元素会影响后续元素的布局，通常需要配合 clearfix 来解决浮动引起的布局问题。

在实际应用中，inline-block 通常用于创建水平排列的导航菜单、标签等，而 float:left 则常用于创建浮动图像或需要严格对齐的布局。在响应式设计中，由于 inline-block 元素会根据内容自适应宽度，因此可能需要额外的媒体查询来调整它们的宽度，以确保在不同屏幕尺寸下的一致性。而 float:left 则可能需要与 clearfix 结合使用，以确保在不同设备上的布局不会混乱。

总之，选择使用 inline-block 还是 float:left 取决于具体的布局需求和设计目标。在响应式设计中，需要考虑到不同设备上的显示效果，并可能需要结合使用多种布局技术来确保最佳的用户体验。