当小于600px时，更改导航区最小宽度为60px，将超链接中的文本取消显式，即仅显示图标

你可以使用 CSS 中的媒体查询来实现当小于 600px 时更改导航区最小宽度为 60px，并将超链接中的文本取消显式，即仅显示图标。

CSS 代码：

.sidebar {
  display: flex;
  flex-direction: column;
  min-width: 180px;
}

.sidebar a {
  display: flex;
  align-items: center;
  padding: 10px;
  text-decoration: none;
  color: #333;
}

.sidebar a:hover {
  background-color: #eee;
}

.sidebar a i {
  margin-right: 10px;
}

.sidebar a span {
  vertical-align: middle;
}

/* 当小于 600px 时 */
@media screen and (max-width: 600px) {
  .sidebar {
    min-width: 60px;
  }
  
  .sidebar a span {
    display: none; /* 隐藏文本 */
  }
}

这里的 `@media screen and (max-width: 600px)` 表示当屏幕宽度小于 600px 时，应用媒体查询中的样式。我们将导航区的最小宽度设置为 60px，并且将超链接中的文本隐藏，只显示图标。

同时，我们将超链接中的文本设置为 `display: flex`，并使用 `align-items: center` 将图标和文本垂直居中对齐。这样，在隐藏文本后，图标仍然会保持垂直居中。