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

Question

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

 ,ggggggggggggggg     
dP""""""88"""""""     
Yb,_    88            
 `""    88            
        88            
        88  gg     gg 
        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"

Answer 1

我想你要找的是这样的：

.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> 标签中。然后我使用绝对定位重新排列字母，就像它们以前一样。

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

How can I change colour in ASCII art letters in HTML between <pre> tags?

html

css

ascii

ascii-art