【问题标题】:CSS Grid nested in a wrapper-div or a body element?CSS Grid 嵌套在 wrapper-div 或 body 元素中?
【发布时间】:2019-03-10 19:07:36
【问题描述】:

在本系列中,他们都使用了包装 div。

MDN - CSS GRID Layout

这是否必要,如果是,为什么?

【问题讨论】:

  • 一切都取决于你是否会有更多的内容在正文中
  • 好的,对于整个页面布局,没有理由不使用 body-element 作为网格容器。谢谢

标签: css css-grid


【解决方案1】:

包装器的用途有很多,包括:

  • 对元素进行语义分组,例如分隔页面标题 来自页脚侧边栏的正文。
  • 以美观的方式对元素进行分组,例如使用周围的边框或 常见的背景图片或颜色。
  • 在布局中对元素进行分组,例如使它们保持在同一位置 列浮动时相邻的列。
  • 启用特殊定位,当包装器被赋予相对 定位以包含绝对的子元素 定位。
  • 使在 CSS 和 JavaScript 中指定元素更方便 通过引用他们的父母,而不必对每个人进行 id 或 class 子元素。

(注意:上面的var都应该在一行上)

所以在这种情况下,我认为他们都使用包装器 div 来对布局中的元素进行分组。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-05-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多