javascript-将em或百分比用于CSS网格布局

我正在3-4页的网站上工作.大多数页面将使用jQuery,jQuery UI和Ajax调用.我希望不必以像素为单位编写任何代码.

到目前为止,我已经花了几天时间寻找解决方案,但由于看不到我想要的东西,我的头一直在旋转.我正在尝试确定如何最好地布置网站,以便它具有响应能力,并能很好地适应浏览器大小的变化.在我看来,使用百分比或em设计的页面比使用固定px进行布局的页面调整大小要好得多.

不确定,但我认为使用“网格”(例如,金色网格)或其他一些网格会造成过度杀伤力.我正在考虑做这样的事情？

#container {
  max-width: 75em;
  margin: 0 auto;
}

#primary {
  float:left;
  width: 25%;
}

#content {
  float:left;
  width:50%;
}

#secondary {
  float:left;
  width:25%;
} 

我应该使用百分比来表示宽度还是应该以ems的方式来做到这一点.我希望我能得到一些好的建议.

谢谢

解决方法:

第一：根据您的情况使用百分比.
百分比取决于其父元素,而em基于字体大小.如果要基于浏览器大小调整站点大小,请使用％；如果要在用户更改字体大小时调整站点大小,请使用em.

一些其他想法：

根据我的经验,％,px,em的选择取决于项目(因此取决于网站的目标).

如果网站是某种投资组合,我建议使用基于像素的布局. (因为大多数人将其视为工作的数字版本,并希望它看起来像(预布局的)草稿一样).
这样您可以获得不错的结果,但是在调整网站大小时可能会遇到问题(例如,文本变大).

在这种情况下,(显然)相对系统会更好,因为它们的伸缩性很好.这通常使用户更友好,因为您可以保证容器刻度合适.
如果要使站点更易于访问,请使用此选项.

请记住,您可以使用基于像素/相对的布局,仍然可以解决其他问题.通常,总体布局是基于％的,但是某些容器是基于像素的.

而且由于您使用的是JS来增强您的网站,因此可以使用它来动态调整网站的大小或做其他事情(尽管并非必要,但由于并非所有人都在使用,因此我不建议这样做. JS(但这是另一个故事)

标签：jquery-ui,css,html,javascript,jquery
来源： https://codeday.me/bug/20191201/2081501.html