HTML 标记中的 Bootstrap 3 模式放置

2024-04-11

引导程序(docs http://getbootstrap.com/javascript/#modals)说“始终尝试将模式的 HTML 代码放置在文档的顶级位置,以避免其他组件影响模式的外观和/或功能。”

这是否意味着将模态框放在我的最顶部<body>标签?如果是这样,为什么?


A '最高层职位' 不一定意味着第一个,它意味着它需要靠近 DOM 树的顶部。

例子:

<body>
  <div id="content">
    <div id="modal"></div>
  </div>
</body>

这不是在 DOM 的顶部,因为div#modal is inside div#content。所以我们有这个 DOM 树:

body
 +-> div#content
      +-> div#modal

另一个例子:

<body>
  <div id="content">
    <!-- Content goes here -->
  </div>
  <div id="modal"></div>
</body>

虽然div#modal不在页面顶部,而是在 DOM 树的顶部:

body
 +-> div#content
 +-> div#modal
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

HTML 标记中的 Bootstrap 3 模式放置 的相关文章