问题接壤

-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

回答

相关问题