跑马灯效果（图标为例）

向右滑动效果

代码实现

<template>
  <ul class="homeCategories">
    <li v-for="item in categories" :key="item.id">
      <img :src="item.pictureUrl" alt="">
      <h3>{{ item.title }}</h3>
    </li>
  </ul>
</template>

.homeCategories {
  // 关键代码
  // 1. flex布局 在一行上
  display: flex;
  // 2. 溢出滚动
  overflow-y: auto;

  // 隐藏滚动条
  &::-webkit-scrollbar {
    display: none;
  }

  li {
    text-align: center;

    img {
      width: 32px;
      height: 32px;
    }

    h3 {
      width: 80px;
      font-size: 14px;
      font-weight: normal;
    }
  }

}