我的主页显示有问题。这是我第一次尝试响应式设计，我想到目前为止还不错。我在这里上传了项目：https ://adventuretrails.000webhostapp.com您应该也可以在那里访问所有必要的资源。
由于这是一个非常早期的版本，因此涉及很多错误，但我希望您专注于这个特定的错误：
如果您调整浏览器窗口的大小，您可以看到样式更改为平板电脑版本，如果您将窗口缩小一点到移动版本。这就是我希望我的主页在每台移动设备上显示的方式。
由于设备具有不同的分辨率，只要移动设备的像素比为 1，它看起来不错，如果像素比为 2（iphone5）看起来还不错，但高于 2 的所有东西都绝对丑陋。
我知道我可以为每个可能的像素比设置 css 样式，但这不是最终的解决方案，对吧？我猜现在最大的习惯设备像素比大约是 4。但几年后还会有更多。
那么有没有办法让浏览器知道，以设备像素比 1 显示我的主页？或者类似的解决方案，它为我节省了为每个像素比率定义 css 样式的弯路？