我想做一个div，有两行文字，第一行文字是 智慧城市视域下 第二行文字 云南红色文化旅游知识图谱的建立与应用 ，第一行字大，第二行字小，总体字的大小可以根据窗口的大小而自行变换

你可以使用CSS中的`@media`查询和相对单位来实现根据窗口大小自动调整字体大小，并通过HTML中的`<br>`标签来实现两行文字的效果。以下是一种实现的方法：

HTML结构：

<div class="container">
  <div class="text">
    <span class="first-line">智慧城市视域下</span>
    <br>
    <span class="second-line">云南红色文化旅游知识图谱的建立与应用</span>
  </div>
</div>

CSS样式：

.container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.text {
  text-align: center;
}

.first-line {
  font-size: 4vw; /* 设置第一行文字的字体大小 */
}

.second-line {
  font-size: 2vw; /* 设置第二行文字的字体大小 */
}

/* 在窗口宽度小于600px时，调整字体大小 */
@media (max-width: 600px) {
  .first-line {
    font-size: 6vw;
  }

  .second-line {
    font-size: 3vw;
  }
}

在上述代码中，`.first-line` 和 `.second-line` 类分别用于设置第一行和第二行文字的样式。通过设置`font-size`属性，可以根据视窗宽度的百分比来自动调整字体大小。

在`@media`查询中，通过设置`max-width: 600px`，当窗口宽度小于600px时，将会应用其中的样式，从而可以根据不同的窗口大小进行适当的调整。

这样设置后，第一行文字会根据窗口大小自动调整大小，并且第二行文字会保持相对较小的字体大小。你可以根据需要调整字体大小和`@media`查询的阈值。