需要帮助以创造性的方式显示wordpress菜单

Question

我有一个wordpress网站的设计，需要将菜单构建为附加图像。 我想过重复黑色“/”的背景和带有白色背景的类别/页面名称，但我觉得它看起来不太好。 我想过有一个填充黑色“/”的功能，但不知道如何开始。 任何想法将不胜感激。谢谢 ！ （请忽略蓝线）。

Answer 1

我认为平铺背景是可行的方法，但实际上你需要使用三个图像来使它看起来正确。

因此，如果您将此菜单设为列表，则可以为每个<li>提供css text-align: right;background:url(slashes.jpg);

然后你需要两个包含白色三角形的图像，它们具有正确的形状来掩盖图案的开始和结束。让我们说这些都是10px宽。

您可以将<a>填充左边的10px，并将右边的白色三角形作为左对齐的非重复背景。

然后，在每个<li>内，您可以添加一个小div或其他元素，这是li的整个高度，左边是浮点数，背景图像是左侧元素。通过这种方式，您只能显示完整的对角线，并且没有损坏的线条。尽管如此，对角线的宽度可能不一致。也许可以通过使用等宽字体和css中的字母间距来防止这种情况，以保证每个字母在链接中占用多少水平。例如，您可以为（1个字母= 2个斜杠）

制作公式

Answer 2

@shir;为背景和＆amp;创建/图片你可以像这样使用它

例如

ul{
    list-style:none;
    float:right;
}
ul li{
    background:url(tile.jpg) repeat-x;
    width:100px;
    font-family:verdana;
    font-size:14px;
    margin-bottom:5px;
    text-align:right;
}
ul li a{
    background:red;
    text-decoration:none;
    color:yellow;
}

检查 http://jsfiddle.net/sandeep/Dfjvm/ 例如，使用谷歌图像作为假人。可能对你有所帮助。