如何使用img標簽刪除白色邊框

Question

我找不到解決方案。

如何刪除三角形周圍的白色邊框？

碼：

.triangle{
    background: url('/img/triangle.png');
    background-size: cover;
    width: 15px;
    height: 15px;
    margin:0px;
    padding:0px;
    border: none;
}

<img class="triangle" />

Answer 1

您的標記無效。 白色邊框來自您的瀏覽器圖像未找到可視化。 要更正您的標記，請為圖像本身設置src屬性（這是強制性的， 請參見MDN ）：

<img src="/img/triangle.png" />

或將其替換為具有給定背景屬性的div，如下所示：

 .triangle { background: url('https://upload.wikimedia.org/wikipedia/commons/thumb/3/3c/Black_triangle.svg/2000px-Black_triangle.svg.png'); background-size: cover; width: 15px; height: 15px; margin: 0px; padding: 0px; border: none; } 

 <div class="triangle"></div> 

Answer 2

如果您打算將img標簽用於此任務，請執行

<img class="triangle" src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/3c/Black_triangle.svg/2000px-Black_triangle.svg.png" />

它應該可以解決您的問題...否則，請執行完全相同的操作，但是將img標記放入div中。

Answer 3

我還將研究“輪廓”和“輪廓顏色”屬性來設置其樣式或使其消失。

這里是更多信息：
http://www.w3schools.com/cssref/pr_outline-color.asp http://www.w3schools.com/cssref/pr_outline.asp