css - 项目符号点垂直对齐

Question

如何在此代码中将项目符号点与文本垂直对齐？我找不到 CSS 属性：

网址：https ://scienceofhappyrelationships.com/mistake-10-neglecting-your-appearance/

谢谢

Answer 1

他们通过在项目符号点字符之前添加一个伪对象来实现项目符号点，<li>该项目符号点字符使用下面的 css 进行样式和定位

.cnt article ul li:before {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    content: '\f04d';
    color: #408c52;
    display: inline-block;
    font-family: FontAwesome;
    line-height: 3em;
    font-size: 5px;
    padding-right: 10px;
}

因为旋转会提高项目符号点，所以您需要将转换的中心设置为项目符号点的中间，这样旋转不会改变高度，因此您需要添加

transform-origin: -50%;

希望这可以帮助！