小衣服图标为什么和后边的a有那么大段距离呢 a不是block

因为 a 所在的父元素上设置了 text-align:center ，所以在这里 a 就会水平居中啦，你如果不想居中，就把 .prite 的 text-align:center 去掉

.sprite s{ float:left; } 你都让他左浮动了，肯定会空出大端距离另外换个标签吧，别用 s 标签了，建议用 i 标签或者 span 标签

display: block; -> 元素为块元素，占满一行楼主了解下inline-block就解决了！

为什么li中的s设成block，会和后边的a有一大段距离呢？

首先，这代码，真心换换吧，直接给你写一段：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8"/>
  <title>示例</title>
  <style>
    html {
      font-size: 10px;
    }
    body {
      font-size: 1.4rem;
    }
    .list ul {
      list-style: none;
      margin: 0;
      padding: 0;
      line-height: 2.9rem;;
    }
    .list ul li {
      border: 1px solid #ddd;
      margin-top: -1px;
    }
    .list ul li a {
      display: block;
      padding: 0 0 0 3rem;
      position: relative;
      text-decoration: none;
      color: #333;
    }
    .list ul li a:hover {
      background-color: #f0f0f0;
      color: #090;
    }
    /**
     * 在下面写 background 加图片即可
     */
    .list ul li a:before {
      content: "?";
      position: absolute;
      width: 2rem;
      height: 2rem;
      left: .5rem;
      top: .5rem;
      border-radius: 1rem;
      line-height: 2rem;
      text-align: center;
      background: #f0f0f0;
    }
    .list ul li a:hover::before {
      content: "@"
    }
  </style>
</head>
<body>
<div class="list">
  <ul>
    <li><a href="#">这是一个标题</a></li>
    <li><a href="#">这是一个标题</a></li>
    <li><a href="#">这是一个标题</a></li>
    <li><a href="#">这是一个标题</a></li>
    <li><a href="#">这是一个标题</a></li>
  </ul>
</div>
</body>
</html>

为什么li中的s设成block，会和后边的a有一大段距离呢？

你尚未登录，登录后可以

js 如何将Key属性相同的放在同一个数组？

如何防止接口的 key 泄露?

字节的 trae AI IDE 不支持类似 vscode 的 ssh remote 远程开发怎么办？

请问开发React Native，一般是推荐哪个主流的UI库呢？

在购买页面，这里有： for 1 month, for 3 months，这里说的意思是什么呢？

www.baidu.com 中的 baidu 被称为什么域名？

快开发完的Vue3项目要做SEO该如何处理？