如何将一个div占据整个页面的宽度并且分成两个平等的部分，一边放多行文字，一边放图片，并且两个的高度相同

您可以使用flex布局来实现。

HTML结构：

<div class="container">
  <div class="text">多行文字</div>
  <div class="image"></div>
</div>

CSS样式：

.container {
  display: flex;
  height: 100vh;  /* 占据整个页面高度 */
}

.text {
  flex: 1;  /* 平分宽度 */
  display: flex;
  align-items: center;  /* 垂直居中 */
  justify-content: center;  /* 水平居中 */
  background-color: #f0f0f0;  /* 设置背景颜色 */
}

.image {
  flex: 1;  /* 平分宽度 */
  background-image: url(图片地址);  /* 设置背景图片 */
  background-size: cover;  /* 让图片完全覆盖容器 */
  background-position: center center;  /* 图片居中显示 */
}

这样就可以实现一个占据整个页面宽度的div，其中一边放多行文字，一边放图片，并且两个的高度相同。