Wordpress下拉菜单 - 添加箭头

Question

我想将下面这样的（CSS？） -arrow添加到我的Wordpress生成的下拉菜单中。

有没有办法做到这一点？

如果您需要更多信息，请询问。

此致

Answer 1

在CSS3中，我们可以制作形状。并非所有形状都能在所有浏览器中正确呈现，目前只有支持CSS3的Web浏览器才能正常工作。

这是标记。

<ul class="sub-menu">
    ...
</ul>

这是风格。

.sub-menu {
    position: relative;
}
.sub-menu:after {
    content: '';
    width: 0; 
    height: 0; 
    border-bottom: 120px solid blue; 
    border-left: 60px solid transparent; 
    border-right: 60px solid transparent; 
    position: absolute;
    top: 0;
    left: 25px;
    transform: translate(0, -100%);
}

您可能会发现这也很有用 - http://www.cssportal.com/css3-shapes/

Answer 2

我对WordPress不太确定，但使用CSS可以配置如下内容：

.buttonArrow:hover
  {
    background: url(blue-arrow.png);
  }

这个想法是在悬停时（或点击下拉菜单），弹出箭头图像。我不确定是否有办法在WordPress上轻松完成。您必须匹配箭头的颜色和下拉列表的颜色，在本例中为蓝色。

/ u / jarmerson的答案也很好。您还可以尝试在W3Schools中查看SVG以获取更多形状。