Question

我不明白为什么在单个字母周围放置一个span标签时会得到一个额外的白色像素。它适用于铬，但不适用于野生动物园。它需要对span标签的数量做一些事情，因为它总是在同一个位置。以下是代码：https://nopaste.me/view/0df8d1e6

以下是一些截图：

的Safari

铬

如果完整代码的链接不再起作用，则在130前面生成相同的白色像素的较短版本。

<html>

<head>
  <style>
    span {
      font-family: "Lucida Console", Monaco, monospace;
      font-size: 10px;
    }
    pre {
      -webkit-background-clip: padding-box;
    }
    .isConserved {
      background-color: #D8D7D6;
    }
    .isNotConserved {
      background-color: none;
    }
    .isHelix {
      background-color: #E2B8B7;
    }
    .is3_10Helix {
      background-color: #F4BF91;
    }
    .isSheet {
      background-color: #B9DBE5;
    }
    .isRandomCoil {
      background-color: none;
    }
  </style>
</head>

<body>

  <table border="0">
    <tbody>
      <tr>
        <td>
          <pre>
<span>                    <span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isRandomCoil">&nbsp;</span><span class="isRandomCoil">&nbsp;</span><span class="isRandomCoil">&nbsp;</span><span class="isRandomCoil">&nbsp;</span><span class="isRandomCoil">&nbsp;</span><span class="isRandomCoil">&nbsp;</span><span class="isRandomCoil">9</span><span class="isRandomCoil">0</span><span class="isRandomCoil">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">1</span><span class="isHelix">0</span><span class="isHelix">0</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="is3_10Helix">&nbsp;</span><span class="is3_10Helix">&nbsp;</span><span class="is3_10Helix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">1</span><span class="isHelix">1</span><span class="isHelix">0</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">1</span><span class="isHelix">2</span><span class="isHelix">0</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">&nbsp;</span><span class="isHelix">1</span><span class="isHelix">3</span><span class="isHelix">0</span>
</span><span>1 CYP102A1          <span class="isConserved">F</span><span class="isConserved">A</span><span class="isConserved">G</span><span class="isConserved">D</span><span class="isConserved">G</span><span class="isConserved">L</span><span class="isConserved">F</span><span class="isConserved">T</span><span class="isConserved">S</span><span class="isNotConserved">W</span><span class="isConserved">T</span><span class="isConserved">H</span><span class="isConserved">E</span><span class="isNotConserved">K</span><span class="isConserved">N</span><span class="isConserved">W</span><span class="isConserved">K</span><span class="isConserved">K</span><span class="isConserved">A</span><span class="isConserved">H</span><span class="isConserved">N</span><span class="isConserved">I</span><span class="isConserved">L</span><span class="isNotConserved">L</span><span class="isConserved">P</span><span class="isNotConserved">S</span><span class="isConserved">F</span><span class="isConserved">S</span><span class="isConserved">Q</span><span class="isNotConserved">Q</span><span class="isConserved">A</span><span class="isConserved">M</span><span class="isConserved">K</span><span class="isNotConserved">G</span><span class="isConserved">Y</span><span class="isConserved">H</span><span class="isConserved">A</span><span class="isConserved">M</span><span class="isConserved">M</span><span class="isConserved">V</span><span class="isConserved">D</span><span class="isConserved">I</span><span class="isConserved">A</span><span class="isConserved">V</span><span class="isConserved">Q</span><span class="isConserved">L</span><span class="isConserved">V</span><span class="isConserved">Q</span><span class="isConserved">K</span><span class="isConserved">W</span><span class="isNotConserved">E</span><span class="isConserved">R</span>


                </pre> 
        </td>
      </tr>
    </tbody>
  </table>
</body>

</html>

感谢您的帮助！

在safari中重复使用span标签的附加白色像素

0 个答案: