响应式就是一个网站能友好适应各种不同的屏幕的尺寸显示。

“断点”标识

断点标识着网页所在的宽度，在这个宽度所做的页面的任何内容编辑和调整，都是能在大于这个宽度的网页内容上获得相应的编辑和调整的。

下面这个橙色线就叫做断点。

断点所在的那一栏可以自由选择并改变断点的位置大小，网页的预览宽度也会相应改变。

默认状态下，断点是在手机小屏的位置，虽然预览页面在工作区里是宽屏的样式，但这时所做的每一个调整都是在所有大于等于手机小屏幕的页面的调整。

注：所以一定要注意断点的所在位置，一般响应式的网站就是让断点保持在手机小屏的位置，这样内容的调整都是响应式的。

举个例子：调整首页标题文字颜色

如果要调整的是响应式网页，也就是在任何屏幕尺寸里内容都被调整，那我就让断点保持在手机小屏的位置进行页面编辑。

在这里我将把标题文字颜色改为红色。可以看到在所有尺寸下的标题文字都为红色。

如果是将断点移动到1024px宽度的时候，然后改变标题文字为蓝色，那么网页的表现就会在大于1024px宽度的时候变为蓝色，小于这个宽度的时候仍然是红色。