java获取font样式_带有font-awesome图标的自定义li列表样式

我想补充一下JOPLOmacedo的答案 . 他的解决方案是我最喜欢的，但是当li有多行时，我总是遇到缩进问题 . 找到带边距等的正确缩进是很繁琐的 . 但这可能只涉及我 .

对我来说绝对定位：在伪元素之前效果最好 . 我在ul上设置了padding-left，在：before元素上设置了负位置，与ul的padding-left相同 . 要获取内容距离：before元素右边，我只需在li上设置padding-left . 当然，李必须有相对的位置 . 例如

ul {

margin: 0 0 1em 0;

padding: 0 0 0 1em; /* make space for li's :before */

list-style: none;

}

li {

position: relative;

padding-left: 0.4em; /* text distance to icon */

}

li:before {

font-family: 'my-icon-font';

content: 'character-code-here';

position: absolute;

left: -1em; /* same as ul padding-left */

top: 0.65em; /* depends on character, maybe use padding-top instead */

/* .... more styling, maybe set width etc ... */

}

希望这是明确的，对我而言比其他人有一些 Value .