要在CSS中以两种不同的颜色显示文本，可以使用:nth-of-type()选择器或者:nth-child()选择器来为特定元素的不同部分应用不同的样式。以下是一个简单的例子，其中使用:nth-of-type()选择器为段落中的两个元素应用不同的颜色。
<p class=“text”>你好，世界！再见，世界！</p>
.text {
color: black; /* 默认颜色 */
}
.text:nth-of-type(1) {
color: red; /* 第一个元素的颜色 */
}
.text:nth-of-type(2) {
color: blue; /* 第二个元素的颜色 /
}
如果你想要的是对单个元素的文本内容的不同部分应用不同的颜色，可以使用CSS的伪元素::before或::after来添加额外的元素，并为它们设置颜色。
<p class=“text”>你好，世界！再见，世界！</p>
.text {
position: relative;
color: black; / 默认颜色 */
}
.text::before {
content: ‘你好，’;
color: red; /* 第一部分颜色 */
position: absolute;
}
.text::after {
content: ‘！再见，世界！’;
color: blue; /* 第二部分颜色 /
position: absolute;
left: 100px; / 根据内容长度调整 */
}
这个例子中，::before伪元素将会显示红色的文本，而::after伪元素将会显示蓝色的文本。注意，使用伪元素时可能需要通过position属性来调整文本位置。