如何使两列在某一宽度上按比例调整大小，但当窗体低于该宽度时只有一列调整大小？

要实现两列在某一宽度上按比例调整大小，但当窗体低于该宽度时只有一列调整大小，可以使用CSS中的Flexbox布局来实现。

Flexbox布局是一种弹性盒子模型，可以方便地实现灵活的布局。以下是实现该需求的步骤：

1. 创建一个包含两列的容器元素，可以使用<div>标签，并为其设置一个固定的宽度，例如width: 800px;。
2. 将容器元素的display属性设置为flex，以启用Flexbox布局。
3. 设置容器元素的flex-wrap属性为wrap，以允许内容换行。
4. 为两列元素分别设置flex-grow属性，用于指定它们在剩余空间中的比例。例如，如果希望第一列占据1/3的宽度，第二列占据2/3的宽度，可以将第一列的flex-grow设置为1，第二列的flex-grow设置为2。
5. 使用媒体查询（Media Query）来检测窗体宽度是否低于设定的宽度。当窗体宽度低于设定宽度时，将第二列元素的flex-grow属性设置为0，以阻止其继续增长。

下面是一个示例的CSS代码：

.container {
  width: 800px;
  display: flex;
  flex-wrap: wrap;
}

.column1 {
  flex-grow: 1; /* 第一列占据1/3的宽度 */
}

.column2 {
  flex-grow: 2; /* 第二列占据2/3的宽度 */
}

@media (max-width: 800px) {
  .column2 {
    flex-grow: 0; /* 窗体宽度低于800px时，只有第一列调整大小 */
  }
}

通过以上步骤，就可以实现两列在某一宽度上按比例调整大小，但当窗体低于该宽度时只有一列调整大小的效果。

请注意，以上示例中的代码仅为演示用途，实际应用中可能需要根据具体情况进行调整。