·

刚研究了下,分享一下自己的经验:

  1. 如果是用现成的组件库,记得把xx-layout-content(仅举例说明)的内部间距设为0,这样在移动端上,内容会紧贴屏幕边界,更美观。
  2. 在分栏布局中,一定要把xs、sm、md、lg这种属性设置完整,这样在改变屏幕宽度时页面会变化得更流畅。粒度越细变化越流畅,很好理解。
  3. 把主内容区的最大宽度(max-width)设置为固定值(例如1200px)比设置为比例值(例如75%)更好,因为设置为固定值的话,缩小屏幕宽度时会先缩小主内容区与外部容器的间距,间距缩不动了再缩小主内容区;设置为比例值的话,缩小屏幕宽度时主内容区会立刻随之缩小,导致主内容区变得“瘦长”。
Replies