html - 垂直对齐 li 内的文本

Question

我有自定义列表项标记，当我显示它们时，文本在底部对齐。如何在中心垂直对齐它。显示 flex 和对齐元素没有帮助。您可以在这里 checkin 沙箱:https://codesandbox.io/s/spring-sun-1yx9k

li {
        list-style-position: outside;
        list-style-image: url("/static/images/list.svg");
    }

Answer 1

不久前我遇到了类似的问题并通过使用 background-image 而不是 list-style-image 解决了这个问题，因为你不能为与那些保持一致。

li {
        background-image: url(/static/images/list.svg);
        background-repeat: no-repeat;
        background-position: left;
        list-style-type: none;
        padding: 15px 0 15px 50px;
    }