Question

前端开发中的交互式与响应式是什么意思有什么区别

Answer 1

一句话概括：
交互式：页面或界面会根据用户的行为（键盘、鼠标、触摸等）进行相应的变化。
响应式：页面或解码会根据屏幕和浏览器的不同而显示不同的样式（排列、显隐）。

“交互式”是针对用户（人）的，“响应式”是针对设备的。

再补充一点儿例子：
交互式：
鼠标移入移出、点击时改变颜色；
输入表单时提示格式是否正确；
鼠标放到图片上显示预览图；
幻灯片；
移动端点击弹出简洁菜单，按住弹出更多菜单；
鼠标或手指拖放排序；
等等……

响应式：
同一个图片展示网页，在电脑等宽屏浏览时一行显示6个，并且图片下面有简短介绍；使用手机浏览时，一行显示2个，文字介绍变成半透明的浮在图片上。
banner图片在电脑、平板、手机上都能显示全屏，并根据不同分辨率加载相应大小的图片。
播放视频时，根据不同的浏览器调用相应的视频文件。

Answer 2

响应式布局指的是，页面会根据不同分辨率自适应调整版式。
好处是兼容性强，可以兼容多个设备的显示效果。
坏处是效率低，样式代码量会翻倍甚至更多。