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

1. **display: inline-block**
- **行为**: 元素以inline方式显示，即它们在水平方向上排列，但每个元素都拥有自己的块级格式化上下文（block formatting context）。这意味着它们可以设置宽度和高度，并且可以与其他inline元素并排显示。
- **对齐**: inline-block 元素可以通过设置 text-align 属性来控制水平对齐方式。
- **换行**: 当 inline-block 元素超过父元素的宽度时，不会自动换行，除非给元素添加了 white-space: nowrap 属性。
- **清除浮动**: inline-block 元素不会受到父元素中 float 元素的影响，因为它们自己创建了块级格式化上下文。
- **适用场景**: inline-block 适合需要保持水平方向排列，但同时需要设置宽度和高度的元素。

2. **float: left**
- **行为**: 元素向左浮动，直到它的边缘碰到包含框或另一个浮动元素的边缘。
- **对齐**: float 元素可以通过设置 margin 属性来控制水平对齐方式。
- **换行**: 当 float 元素超过父元素的宽度时，会自动创建一个块级格式化上下文，并导致后续的元素围绕它排列。
- **清除浮动**: 要清除 float 的影响，需要使用 clear 属性。
- **适用场景**: float 常用于创建布局中的浮动布局，例如侧边栏或图片浮动。

在响应式设计中，考虑到设备的多样性，通常需要根据具体情况选择合适的布局方式。例如，在移动设备上，可能需要使用 inline-block 来确保元素在较小的屏幕上也能正确对齐；而在桌面设备上，可能需要使用 float 来创建复杂的布局。

总结来说，inline-block 适合不需要换行、需要保持水平排列且需要设置宽高的元素，而 float 适合创建浮动布局或需要环绕效果的布局。在响应式设计中，需要根据不同的设备尺寸和布局需求来选择合适的布局方式。