text 缩略图与悬停过渡

Posted 2021-04-29

  .thumbnail {
    transition: color 0.3s ease, background 0.3s ease, transform 0.3s ease, opacity 0.3s ease, border 0.3s ease, padding 0.3s ease, left 0.3s ease, bottom 0.3s ease, box-shadow 0.3s ease;

    @media (max-width: $screen-sm-max) {
      @include center-block ();
      max-width: 260px;
    }

    &:hover,
    &:focus {
      transform: translateY(-3px);
      box-shadow: 0 3px 18px 3px rgba(0, 0, 0, .08);
    }
  }