gpt4 book ai didi

css - 给 fa-circle 添加边框

转载 作者:技术小花猫 更新时间:2023-10-29 11:30:29 25 4
gpt4 key购买 nike

如何为 Font Awesome 中的 circle 图标添加边框?实际上我的结果是:

http://jsfiddle.net/0jhdvj0k/

边框有点像省略号,而不是圆形边框。

<table class="table table-condensed table-hover table-striped">
<thead>
<tr>
<th></th>
<th>AAAA</th>
<th>AAAA</th>
<th>AAAA</th>
<th>AAAA</th>
<th>AAAA</th>
<th>AAAA</th>
</tr>
</thead>
<tbody>
<tr>
<td style="width: 55px;" class="text-center" style="padding-top: 5px; width: 25px;"><span class="label label-success" style="margin-bottom: 3px; display: inline-block; width: 100%; height: 22px; padding-top: 2px;"><i class='fa fa-check' style="font-size: 18px;"></i></span><span style='position: relative; top: -15px; right: 0px; left: 15px;'><span class='fa-stack fa-lg'><i class='fa fa-circle fa-stack-2x text-info' style='border-radius: 100%; border: 2px solid #5cb85c;'></i><span class='fa fa-stack-1x fa-inverse' style='top: 3px;'>6</span></span></span></td>
<td>text</td>
<td>text</td>
<td>text</td>
<td>text</td>
<td>text</td>
<td>text</td>
</tr>
</tbody>
</table>

最佳答案

text-info 上添加了 line-height: 30px; 来固定圆圈,并更改了 fa-inverse top: 0px 到垂直中心数 6

    <i class="fa fa-circle fa-stack-2x text-info" style="border-radius: 100%; border: 3px solid #5cb85c; line-height: 30px;"></i>
<span class="fa fa-stack-1x fa-inverse" style="top: 0px;">6</span>

http://jsfiddle.net/1qzqu83m/

关于css - 给 fa-circle 添加边框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30802208/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com