如何從輸入按鈕隱藏邊框，引導衝突

我試圖使一個fab像材料設計 fab按鈕。如何從輸入按鈕隱藏邊框，引導衝突

我以前border-radius使其圓形，但在那之後，當我點擊它選擇爲方形這樣的：

.fab { 
 
    border-radius: 50%; 
 
    border: 0; 
 
    color: #000; 
 
    margin: auto; 
 
    padding: auto; 
 
    vertical-align: middle; 
 
    box-shadow: 0 2px 7px rgba(0, 0, 0, .5); 
 
    position: fixed !important; 
 
    right: 20px; 
 
    bottom: 20px; 
 
    z-index: 100; 
 
    -webkit-user-select: none; 
 
} 
 

 
.fab.big { 
 
    width: 50px; 
 
    height: 50px; 
 
}

<button class="fab big white ripple red-ripple"> 
 
    <i style="font-size:18px;" 
 
    class="material-icons"> 
 
    add 
 
    </i> 
 
</button>

我想要一個晶圓廠的按鈕是這樣的：Material Design Lite Buttons

我也試過-webkit-user-select: none但它沒有奏效。

同樣的事情也發生在正常的按鈕，我該如何解決這個問題？

來源

2016-11-24 Rak_code

研究* CSS形狀*。除此之外，HTML中的任何元素都將是一個矩形。 – connexo

是啊，我知道，但我想隱藏那個選定的邊框那就是 –

'outline：none;' – connexo

正如評論中提到的outline: none;可用於防止點擊時顯示方形邊框。

.fab{ 
 
border-radius:50%; 
 
border:0; 
 
color:#000; 
 
margin: auto; 
 
padding:auto; 
 
vertical-align: middle; 
 
box-shadow:0px 2px 7px rgba(0,0,0,0.5); 
 
position:fixed !important; 
 
right:20px; 
 
bottom:20px; 
 
z-index:100; 
 
-webkit-user-select:none; 
 
    outline: none; 
 
} 
 

 
.fab.big{ 
 
width:50px; 
 
height:50px; 
 
}

<button class="fab big white ripple red-ripple"><i style="font-size:18px;" class="material-icons">add</i></button>

來源

2016-11-24 19:09:28 JSouthward

如何從輸入按鈕隱藏邊框，引導衝突

回答

相關問題