标签 + 箭头 的伸缩 CSS

<div class="css-krocx8 e10rboum0"><span class="css-1mzq4wf e10rboum1">了解更多</span><svg width="18" height="12" viewBox="0 0 18 12" align="Left" animationdurationms="300" class="css-wt0h02 e10rboum2"><g fill="none" fill-rule="evenodd"><path d="M-943-3049H497v9442H-943z"></path><path d="M-2-3h16v16H-2z"></path><path d="M8.615 6H1a1 1 0 1 1 0-2h7.613L7.139 2.526a1 1 0 1 1 1.414-1.414l3.182 3.182a1 1 0 0 1 0 1.414L8.553 8.89A1 1 0 0 1 7.14 7.476L8.615 6z" fill="currentColor"></path></g></svg></div>

 

CSS

@media (hover: hover) {
  .css-1mzq4wf {
    opacity: 0;
  }
}

.css-1mzq4wf {
  padding-right: 24px;
  -webkit-transition: opacity 300ms ease-out;
  transition: opacity 300ms ease-out;
}




.css-u81etd {
  padding-right: 24px;
  -webkit-transition: opacity 300ms ease-out;
  transition: opacity 300ms ease-out;
}