让您的网站响应最简单的方法之一是使用Bootstrap。使用此链接作为起点：
http://getbootstrap.com/getting-started/
您将需要在您的网站上包括引导文件，并使用他们的类，您将在他们的网站上找到，以使您的内容更改宽度，并在不同的屏幕尺寸下彼此下降。

您希望了解media queries，它允许您根据特定条件更改CSS。
如果这太令人生畏，您可以简单地使用诸如Bootstrap这样的框架，它已经做了基础工作，您只需要添加相关的文档。

使用Bootstrap媒体查询或仅使用自定义媒体CSS属性。
对于引导程序，您可以简单地在您索引样式标记中使用CDN链接（如下所示）来使用CSS，而无需在您的项目中下载，然后在您的代码中应用可用的类。

<link rel="stylesheet" href="./contact_files/bootstrap.min.css" />

添加下面的Media CSS根据您的设备宽度在style标签中对您的index or main实现响应。

@media screen and (max-width: 600px) {
  body {
    background-color: Yellow;
    color: Pink;
  }
}

@media screen and (max-width: 711px) {
  body {
    background-color: Green;
    color: Red;
  }
}

参考资料：

• https://www.geeksforgeeks.org/bootstrap-media-queries/