Inline-block 和 float:left 是 CSS 中两种不同的布局方式，它们在响应式设计中的表现差异主要体现在以下几个方面：

1. **布局方式不同**：
- `inline-block` 属性值将元素显示为内联元素，但同时具有块级元素的某些特性，比如可以设置宽度和高度。这种布局方式通常用于需要元素水平排列且每个元素独占一行的情况。
- `float: left` 属性值将元素向左浮动，直到它的边缘碰到包含框的边缘。这通常用于创建多列布局，其中每一列都可以包含多个元素。

2. **对父元素的影响不同**：
- `inline-block` 元素不会为它的内容增加额外的空白（white-space），因此不会影响父元素的宽度。
- `float: left` 的元素会从父元素的内容流中移出，直到浮动元素的右侧没有其他内容为止。这可能会导致父元素的宽度发生变化，因为浮动元素会占用空间。

3. **对兄弟元素的影响不同**：
- `inline-block` 元素的兄弟元素会围绕在它周围，除非这些兄弟元素也设置了 `inline-block` 或者 `float`。
- `float: left` 的元素的兄弟元素会堆叠在其下方，除非这些兄弟元素也设置了 `float`。

4. **清除浮动的方式不同**：
- 在 `inline-block` 布局中，通常不需要清除浮动，因为元素是按顺序排列的。
- 在 `float: left` 的布局中，如果需要让后续的元素位于浮动元素的下方，则可能需要使用 `clear: both` 来清除浮动。

5. **适应性**：
- `inline-block` 布局通常在响应式设计中更易于使用，因为它不会改变父元素的宽度，并且可以更好地适应不同的屏幕尺寸。
- `float: left` 的布局可能需要更多的媒体查询和样式规则来适应不同的设备宽度，尤其是在需要保持列宽固定的情况下。

6. **水平对齐方式不同**：
- `inline-block` 元素可以通过设置 `text-align` 属性来控制水平对齐方式。
- `float: left` 的元素通常需要通过设置 `margin` 或 `padding` 来调整其位置，或者使用辅助元素来进行对齐。

在实际应用中，选择 `inline-block` 还是 `float: left` 取决于具体的布局需求和设计目标。如果需要创建一个响应式布局，通常 `inline-block` 会更易于维护和适应不同的屏幕尺寸。然而，如果需要精确控制元素的位置和布局，`float: left` 可能是一个更好的选择。