我一直在尝试让此滚动条代码在Blogger上运行,但还无法弄清楚该怎么做。有人可以查看他们是否能够弄清楚问题是什么以及如何解决。

相同的代码,外观和行为都不同,

Jsfiddle:

https://jsfiddle.net/xuc92tt3/

Screenshot



Blogger:

https://debugscroll.blogspot.com/

Screenshot

另外,在div块下方也不应有水平线。



<style>
      .test {
        width: 266px;
        height: 175px;
        padding: 0;
        margin: 0;
        overflow: auto;
        background: #000;
        list-style: none;
        text-align: left;
      }

      .test li {
        padding-bottom: 20px;
      }

      .test li:last-of-type {
        padding: 0;
      }

      h2 {
        margin: 0;
        line-height: 1;
        font-size: 25px;
        color: #00f;
      }

      .test a:link {
        width: 243px;
        height: 20px;
        display: block;
        background: green;
      }

      .test a:visited {
        background: #f00;
        color: #000000;
      }

      .test a:hover {
        color: #000;
      }

    </style>


    <ul class="test ">
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
      <li>
        <h2>Text</h2>
        <a href="#" target="blank"></a>
      </li>
    </ul>

最佳答案

看起来在blogspot示例中,您的<li>元素正在从页面标题部分中声明的全局样式继承15px填充。

尝试使用以下CSS覆盖它:

.test li {
    padding-bottom: 20px;
    padding-left: 0;
    padding-right: 0;
}

关于html - 调试在Blogger上无法正常工作的滚动条代码,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/47296362/

10-13 00:54
查看更多