CSS - 邊框半徑

-1

我需要精確地重新創建一個圖標。一個我從字體真棒已是不完全一樣，這裏的區別 -CSS - 邊框半徑

底部的形象是怎麼需要它的樣子。我可以使用邊框半徑在圖標周圍創建圓形嗎？我怎麼做？

我從FA編碼直接的圖標 -

與字體真棒

<i class="fa fa-angle-down fa-3x" aria-hidden="true"></i>

來源

2017-06-29 Mike.Whitehead

仍有fontawesome一個'字形的圓down'圖標 - http://fontawesome.io/icon/chevron-circle-down/ –

@NikhilNanjappa你能夠改變顏色？與黑色雪佛龍的白色圓圈？我需要它來做其他事情。 –

是的，圓形的顏色可以更改爲'顏色：白色'到'fa-chevron-circle-down'類，但箭頭的顏色將是背景的顏色。那很好嗎？如果沒有，那麼你有選擇，但使用font-awesome中的「堆疊」圖標 –

試試這個

.xyz{ 
 
width:150px; 
 
height:150px; 
 
background:blue; 
 
}

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" /> 
 
<div class="xyz"> 
 
<span class="fa-stack fa-lg"> 
 
    <i class="fa fa-circle fa-stack-2x" style="color:#fff"></i> 
 
    <i class="fa fa-chevron-down fa-stack-1x"></i> 
 
</span> 
 
</div>

來源

2017-06-29 12:58:06

可以疊加的圖標，所以只需添加一個圓圈你的圖標，像這樣：

<span class="fa-stack fa-lg"> 
    <i class="fa fa-circle fa-stack-2x"></i> 
    <i class="fa fa-angle-down fa-3x" aria-hidden="true"></i> 
</span>

看看http://fontawesome.io/examples/舉些例子。

來源

2017-06-29 12:39:14

試試下面的代碼：

<i class="fa fa-chevron-circle-down" aria-hidden="true"></i>

來源

2017-06-29 12:42:05 Riyaz

嘗試四捨五入圓級引導4這樣做。 https://v4-alpha.getbootstrap.com/utilities/borders/

或者你可以嘗試給相同的高度和寬度，以雪佛龍和指定邊界半徑爲50％

希望它可以幫助

來源

2017-06-29 12:52:03

你可以做到這一點，即使沒有CSS

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" /> 
 
<span class="fa-stack fa-lg"> 
 
    <i class="fa fa-circle fa-stack-2x"></i> 
 
    <i class="fa fa-angle-down fa-2x fa-stack-1x fa-inverse"></i> 
 
</span>

來源

2017-06-29 12:52:06 Gerard

CSS - 邊框半徑

回答

相關問題