如何让 box1 占据剩余空间,并排除 box2 的内容?

如何让 box1 占据剩余空间,并排除 box2 的内容?

如何使 box1 排除 box2 内容后占据剩余空间?

要实现 box1 排除 box2 内容后占据剩余空间,可以使用以下两种方案:

  • 方案 1:使用 calc()
#box1 {
  width: calc(100% - 200px);
}
  • 方案 2:使用 flex 布局
#content {
  display: flex;
  flex-direction: row;
}

#box1 {
  flex: 1;
}

#box2 {
  flex-shrink: 0;
  width: 200px;
}

以上就是如何让 box1 占据剩余空间,并排除 box2 的内容?的详细内容,更多请关注其它相关文章!