問題接壤

-2

我只是做一個箭頭在CSS中使用此代碼：問題接壤

 .icon{ 
 
      height: 0; 
 
      width: 0; 
 
      border: solid transparent; 
 
      border-width: 10px; 
 
      border-left-color: aquamarine; 
 
      border-top-color: saddlebrown; 
 
      border-right-color: salmon; 
 
      border-bottom-color: steelblue; 
 
     }

<div class="icon"></div>

正確的三角形：

和結果是4個正確的三角形 但是當我使用相同的代碼在其他地方的結果看起來像下面的圖片，劃分框的寬度和高度是不一樣的。

不正確的三角形：

來源

2016-07-24 saru

別的地方意味着你在哪裏使用？ – Sree

在**其他地方**有一條規則覆蓋你的* .icon *'height：0;'規則。 – dNitro

我在另一個文件中編寫了完全相同的代碼！包含'height：0;' – saru

您應該只是工作wtih Positions，使該width和height作品...

來源

2016-07-24 08:16:38 saru

試試這個速記代碼。只是根據你的喜好改變你的顏色/樣式/邊框的寬度。

.icon{ 
    border-color: yellow blue red green; 
    border-style: solid; 
    border-width: 200px 200px 200px 200px; 
    height: 0px; 
    width: 0px; 
}

來源

2016-07-25 07:29:48 Lucky

實際上，他只是在其他地方爲這個div設置了一些填充。見[this]（https://jsfiddle.net/zcqvbhLv/） –

@Mark Perera嗯...你是對的... – Lucky

取消已設置填充別處

.icon{ 
    ... 
    padding: 0; 
    ... 
}

來源

2016-07-25 07:36:18

回答

相關問題