Question

我没有使用特定的框架，而是创建了自己的图标字体。但是，当我在按钮内写出图标时就可以了，但是如果我改变按钮的高度，则图标会趋于对齐，而上方的空间会将其推得太低。任何人都对如何稳定地进行这项工作有任何想法？

尝试行高并使用flex，但是flex会移动整个按钮。行高并没有任何改变。

<button class="button icon"><i class="icon-plus" /></button>

.button {
...
 &::after {
      content: '\e00E';
      font-family: $font-family-icons;
      color: $white;
      font-size: 1.2rem;
      width: 1.2rem;
      height: 1.2rem;
      position: absolute;
      top: calc(50% - 0.6rem);
      left: calc(50% - 0.6rem);
      @include animation-zoom-in();
    }
}

i {
  position: relative;
  font-family: YouCruitIconFont, sans-serif !important;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: middle;
  font-size: inherit;
  -webkit-font-smoothing: antialiased;

  & + span {
    vertical-align: middle;
    margin-left: 0.5rem;
  }
}

Answer 1

您尝试过

gremlin> g.V().hasLabel('person').
......1>   choose(values('age').is(lt(29)),
......2>          constant('lt29'),
......3>          choose(values('age').is(gt(29)),
......4>                 math('_ - 29').by('age'),
......5>                 constant('29')))
==>29
==>lt29
==>3.0
==>6.0

如何根据按钮的大小修复按钮中未对齐的图标

1 个答案: