使用 Font Awesome 管理无序列表中的列表样式大小

Question

我得到此代码以在无序列表中使用 Font Awesome 图标。

它工作正常，但我想使图标更大并使其与文本垂直对齐。

.node .field-name-body ul li { color:#333;list-style: none;}

.node .field-name-body ul li:before {    
    font-family: 'FontAwesome'; /* http://fortawesome.github.io/Font-Awesome/cheatsheet/ */
    content: '\f043';
    margin:10px 5px 0 -15px;
    color: black;
}

添加字体大小对我没用

Answer 1

*{
    padding: 0;
    margin: 0;
}
ul{
    margin: 25px;
}
ul li { 
    color:#333;
    list-style: none;
}

ul li:before {    
    content: '';
    font-family: 'FontAwesome'; 
    content: '\f043';    
    color: black;
    vertical-align: middle;
    display: inline-block;
    font-size: 25px;    
    margin-right: 5px;
}

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<ul>
    <li>Link1</li>
    <li>Link2</li>
    <li>Link3</li>
    <li>Link4</li>
</ul>

使用 Font Awesome 管理无序列表中的列表样式大小

Manage list-style size in unordered list using Font Awesome

css

font-awesome