Question

新手在这里。

我试图在顶部创建用三角形设计的下拉菜单。我希望每个下拉菜单都是不同的颜色，但我不能为我的生活弄清楚如何让每个三角形改变...我已经搜索了高低，我没有太多运气。如果有人可以提供帮助，我真的很感激！这是我用来制作三角形的内容。

nav ul li ul:after {
position: absolute;
left: 50%;
margin-left: -10px;
top: -10px;
width: 0;
height: 0;
content:'';
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #fff; }

另外，就像我说的那样，我对此非常陌生，所以如果我的代码有任何问题，我可以改进，请告诉我...谢谢！：）

https://jsfiddle.net/LtuyhLrr/1/

Answer 1

你只需要将它添加到CSS的底部

.menupurple:after {
  border-bottom-color: #dda1d8;
};

.menupink:after { 
    border-bottom-color: #ff5e7e;
}

<强>背景

CSS中当前正在控制三角形的线条＆＃39;颜色是border-bottom: 10px solid #fff;

目前，您将覆盖紫色和粉红色菜单的背景颜色，但您不能覆盖创建三角形的边框颜色。

带有三角形的独立彩色下拉菜单？

1 个答案: