如何使我的网站更加适合移动设备?

时间:2020-08-07 20:22:30

标签: mobile mobile-safari

我正在寻找有关如何在移动设备上显示我的网站并在PC和iPad上正确加载但在移动设备上太大的建议:

这是我的网站之一: https://amtgridiron.neocities.org/bflers/

这是CSS代码链接: https://amtgridiron.neocities.org/bflers/bfl.css

我喜欢将内容放在中间,因为它看起来不错,但是在移动设备上,内容看起来太大。

其他页面:

https://amtgridiron.neocities.org/bflers/bflchampionshipgame.htm

我需要带有表格的页面一起显示在网站上,以显示按时间顺序排列的结果,但是内容仍然太大,任何提示将不胜感激?

期待您的来信

亚历克斯

1 个答案:

答案 0 :(得分:0)

我认为在您的情况下使用类似 Bootstrap 的框架将使您的生活更轻松。

如果您不知道Bootstrap是什么,它是一个CSS框架,用于开发响应移动优先应用程序,这意味着您可以进行设计移动和台式设备都可以访问您的网站。

这也可以通过使用媒体查询在常规CSS中实现,因此您可以通过选择最大宽度来为移动设备设计Web。这是一个小例子:

@media (max-width: 600px) {
 .facet_sidebar {
   display: none;
  }
}

在这种情况下,如果最大宽度小于600px,则网站将不会显示侧边栏。

您可以在网络中使用它,例如,您可以调整列和行。