嘿，你的需求完全可以实现！不过得先说明：纯CSS没法直接替换文本内容（目前CSS还没原生支持文本替换的属性），但我们可以用JavaScript+CSS的组合轻松搞定；要是你有权限调整HTML结构的话，还能得到更优雅、易维护的长期方案。下面分两种场景给你具体实现方法：

这个方案不用动页面的HTML代码，只需要加一小段JS代码和配套CSS，就能把" -- "转换成换行效果：

1. 用JavaScript替换分隔符 #

这段代码会找到所有存放曲目文本的元素（假设元素的类名叫.track-list，你可以根据实际页面的类名修改），把文本里的" -- "替换成换行标签<br>：

// 定位所有曲目容器
const trackElements = document.querySelectorAll('.track-list');

// 遍历每个容器，替换分隔符为换行
trackElements.forEach(element => {
  element.innerHTML = element.textContent.replace(/ -- /g, '<br>');
});

2. 用CSS优化排版 #

替换后可以给曲目之间加些间距，让列表更舒服：

.track-list br {
  margin: 0.5em 0; /* 控制曲目之间的垂直间距 */
}

.track-list {
  line-height: 1.6; /* 优化行高，提升可读性 */
}

如果你有权限调整页面的HTML代码，建议把每个曲目单独放在列表项里，这样既符合语义化，排版也更灵活：

<ul class="track-list">
  <li>Track 1. Flowers for Sarajevo (7:48)</li>
  <li>Track 2. Flowers for Sarajevo author's note, historical note, and brief biography of Vedran Smailovic (7:30)</li>
  <li>Track 3. "Streets of Sarajevo" (4:42)</li>
</ul>

再用CSS美化列表：

.track-list {
  list-style: none; /* 去掉默认的圆点标记（不需要的话可以保留） */
  padding-left: 0;
}

.track-list li {
  margin-bottom: 0.5em;
  line-height: 1.6;
}

之后如果需要拓展功能或者查更多资料，可以搜这些关键词：

• JavaScript replace text with line break
• CSS style track list layout
• Semantic HTML for music track listings

内容的提问来源于stack exchange，提问作者aslum