css格式化字符串内容

Question

我有一个值为：

的字符串

1 - If (a12 + aaGrossVehicleWeight is equal to 100 + 60) test1 = aaModelCode(Always Overwrite) test1 = 42 a12 = aumtReadingDate+1 2 - If (a12 is equal to 20) test1 = (Always Overwrite) test1 = a12 = 1+2

是否可以使用CSS以不同的字体和颜色格式化上述内容，如附带的屏幕截图所示？

different font color for the content

Answer 1

假设这样的事情，

<ul>
    <li>1 - If (a12 + aaGrossVehicleWeight is equal to 100 + 60) test1 = aaModelCode(Always Overwrite) test1 = 42 a12 = aumtReadingDate+1</li>
    <li class="style2">2 - If (a12 is equal to 20) test1 = (Always Overwrite) test1 = a12 = 1+2</li>
</ul>

<style>
    .style2{
        font-size: 18px;
        color: red;
    }
</style>

Answer 2

您可以使用HTML定义列表，类的概念，并使用类为文本的每个部分应用颜色。示例代码如下所示。

.red {
  color: red;
}
.blue {
  color: blue;
}
.darkblue {
  color: darkBlue;
}

<dl>
  <dt class="blue">1.Some random text</dt>
  <dd class="red">dummy text dummy text<span class="darkblue"> dummy text</span></dd>
  <dt class="blue">2.Some random text</dt>
  <dd class="red">dummy text dummy text dummy text<span class="darkblue"> dummy text</span></dd>
  <dt class="blue">3.Some random text</dt>
  <dd class="red">dummy text dummy text dummy text<span class="darkblue"> dummy text</span></dd>
</dl>