邊框半徑：在控制檯中劃出圓形圖像的50％

我遵循在ReactJS中創建圓形圖像的標準過程。邊框半徑：在控制檯中劃出圓形圖像的50％

.about-profile { 
    display: block; 
    width: 260px; 
    height: 260px; 
    border-radius: 50%; 
} 

<img className="about-profile" src="./images/profile.jpg"/>

爲什麼border-radius: 50%沒有在這種情況下應用？

來源

2016-09-29 patrickhuang94

交叉出文本意味着它覆蓋其他地方！你確定你的元素沒有應用其他的CSS嗎？另外'邊界：1px純紅色';'和'border-left：2px純藍色;'會劃掉'border：'規則 – Justinas

這就是CSS中的級聯。其他一些規則是覆蓋你的邊界半徑。

欲瞭解更多詳情，請參閱https://www.w3.org/TR/2011/REC-CSS2-20110607/cascade.html#cascade

你可以做的是要麼改變.about-profile更「具體」，或使用!important覆蓋其他規則。我建議前者。

來源

2016-09-29 06:43:33

謝謝。我檢查了我的其他規則，沒有看到任何可能壓倒它的東西。但那是一個正確的答案！將在6分鐘內upvote :) – patrickhuang94

您可以使用此：

border-radius: 50%!important;

來源

2016-09-29 06:47:10 duonghc

一些樣式替代這個代碼，以便使用重要

.about-profile { 
    display: block; 
    width: 260px; 
    height: 260px; 
    border-radius: 50%; 
}

來源

2016-09-29 06:47:14

邊框半徑：在控制檯中劃出圓形圖像的50％

回答

相關問題