自定义CSS创建WordPress下拉菜单

时间:2012-12-01 19:04:27

标签: css wordpress drop-down-menu navigation navbar

我需要将常规导航栏转换为页面的下拉菜单,但是我对代码感到困惑。这是现有的代码。

下面是#header和#mainnav的CSS - 有人可以帮助并指出我需要添加下拉位的位置吗?我真的很困惑,似乎什么都没有用。发布图片

**header

*******************/

#header {

background:url(images/bgHeader.jpg) no-repeat center top;
height:274px;
}

#header h1
{
float:right;
width:280px;
height:200px;
margin:0 0 21px 0;
}

#header h1 a
{
display:block;
width:280px;
height:200px;
text-indent:-9999px;
}

#header h2
{
margin:0 0 0 0;
color:red;
float:left;
text-indent:-9999px;
}

#header #mainNav
{
/*clear:both;*/
float:left;
width:750px;
height:52px;
}

#header #mainNav li
{
display:block;
float:left;
margin-right:30px;
width:auto;
}

#header #mainNav li#menu-item-56
{
    width:87px;
}

#header #mainNav li#menu-item-54
{
    width: 86px;
}

#header #mainNav li#menu-item-53
{
    width: 76px;
}

#header #mainNav a
{
font-size:14px;
line-height:14px;
text-transform:uppercase;
text-decoration:none;
color:#000;
font-weight:bold;
padding-top:13px;
display:block;
}

#header #mainNav li.current_page_item a,
#header #mainNav li.current_page_parent a,
#header #mainNav li a:hover
{
background:url(images/bgMenuActive.jpg) no-repeat center top;
color:#f2152a;
}


#header .social
{
width:171px;
float:right;
margin:13px 0 0 0;
}

#header .social li
{
margin:0 0 0 9px;
}

有人可以帮忙吗?

1 个答案:

答案 0 :(得分:0)

你的意思是你在菜单中添加下拉菜单的内容是什么?如果主题允许 - 您可以使用管理员在菜单编辑器中内置的wordpress将子项添加到菜单中。

http://codex.wordpress.org/WordPress_Menu_User_Guide

否则,添加下拉列表需要的不仅仅是CSS。