有一个响应式的屏幕，两个图像占50%的高度

响应式屏幕是指能够根据不同设备的屏幕尺寸和分辨率自动调整布局和显示效果的网页设计。在这种情况下，两个图像占据屏幕高度的50%意味着它们将平均分配屏幕的垂直空间。

为了实现这个效果，可以使用CSS的Flexbox布局或者CSS Grid布局。以下是一个示例代码：

HTML:

<div class="container">
  <div class="image"></div>
  <div class="image"></div>
</div>

CSS (Flexbox布局):

.container {
  display: flex;
  height: 100vh; /* 设置容器高度为视口高度 */
}

.image {
  flex: 1; /* 图像占据相等的空间 */
  background-image: url('image.jpg');
  background-size: cover;
  background-position: center;
}

CSS (CSS Grid布局):

.container {
  display: grid;
  grid-template-columns: 1fr; /* 列宽度平均分配 */
  grid-template-rows: 1fr 1fr; /* 行高度平均分配 */
  height: 100vh; /* 设置容器高度为视口高度 */
}

.image {
  background-image: url('image.jpg');
  background-size: cover;
  background-position: center;
}

这样，两个图像将会占据屏幕高度的50%，无论屏幕尺寸和分辨率如何变化。这种响应式设计可以适应不同设备，提供更好的用户体验。

关于腾讯云相关产品，可以使用腾讯云的云服务器（CVM）来搭建网站和应用程序，使用对象存储（COS）来存储和管理图像文件，使用内容分发网络（CDN）来加速图像的加载速度。具体产品介绍和链接如下：