在响应式设计中，`inline-block` 和 `float: left` 这两种布局方式的表现差异主要体现在以下几个方面：

1. **显示模式不同**：
- `inline-block` 元素默认具有 `inline` 元素的显示模式，即它们在一行上显示，直到它们的内容或宽度导致它们换行。
- `float: left` 则会使元素浮动到左边，直到遇到父元素的边框或另一个浮动元素，此时它会与下一个元素并排显示。

2. **对齐方式不同**：
- `inline-block` 元素可以通过 `text-align` 属性来控制水平对齐方式，比如 `text-align: center` 可以使元素居中。
- `float: left` 元素则通常需要通过设置外边距 (`margin`) 来控制它们的水平对齐，或者通过 `clear` 属性来清除浮动。

3. **行高影响不同**：
- `inline-block` 元素的行高会继承父元素的行高，并且可以设置 `vertical-align` 属性来控制垂直对齐。
- `float: left` 元素不会继承行高，并且通常需要通过设置 `display: inline-block` 或 `display: block` 来避免行高的继承问题。

4. **对其他元素的影响不同**：
- `inline-block` 元素不会像 `float` 元素那样影响正常的文档流，因此不会导致其他元素围绕它排列。
- `float: left` 元素会浮动并影响周围的元素，其他元素会围绕浮动元素排列，直到浮动元素被清除。

5. **清除浮动的方式不同**：
- `inline-block` 元素不需要清除浮动，因为它们不会像 `float` 元素那样影响文档流。
- `float: left` 元素需要通过 `clear` 属性来清除浮动，或者在父元素中添加 `overflow: hidden` 来清除所有子元素的浮动。

6. **布局灵活性不同**：
- `inline-block` 布局通常更灵活，因为它们不会像 `float` 元素那样影响文档流，并且可以通过 `width`、`height` 等属性轻松设置大小。
- `float: left` 布局可能需要更多的计算和调整，以确保元素正确对齐且不会影响其他元素的布局。

在实际应用中，选择 `inline-block` 还是 `float` 取决于具体的布局需求。如果需要元素水平排列且不影响文档流，`inline-block` 可能是更好的选择。如果需要元素浮动并对齐，`float` 可能是更合适的选择。