html - 如何在<pre>标记之间更改HTML中的ASCII艺术字母的颜色？

在此示例中，我想将“ y”更改为蓝色。

 ，ggggggggggggggggg
dP“”“”“”“ 88”“”“”“”
Yb__ 88
 '“” 88
        88
        88克
        88 I8 8I
  gg，88 I8，，8I
   “ Yb ,, 8P，d8b，，d8I
     “ Y8P'P”“ Y88P” 888
                 ，d8I'
               ，dP'8I
              ，8“ 8I
              I8 8I
              `8，，8I
               “ Y8P”

最佳答案

我认为您要寻找的是这样的：

.y-text {
  color: blue;
  position: absolute;
  top: 82px;
  left: 80px;
}

<pre>
  ,ggggggggggggggg
dP""""""88"""""""
Yb,_    88
 `""    88
        88
        88
        88
  gg,   88
   "Yb,,8P
     "Y8P'
</pre>
<pre class="y-text">
  gg     gg
  I8     8I
  I8,   ,8I
 ,d8b, ,d8I
 P""Y88P"888
       ,d8I'
     ,dP'8I
    ,8"  8I
    I8   8I
    `8, ,8I
      `Y8P"
</pre>

基本上，您需要做的就是将两个字母彼此分开，并将每个字母放在自己的<pre>标记中。然后，我使用绝对定位来重新排列字母，就像以前一样。

关于html - 如何在<pre>标记之间更改HTML中的ASCII艺术字母的颜色？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/49974243/