Question

尝试使用css创建一个下拉菜单，但它有一些奇怪的错误。这是我正在处理的网站的链接。

http://shekinahgloryfire.com/?page=about

我的CSS是这样的：

#nav ul{float:left;margin-top:95px;list-style:none;padding-left:140px;}
#nav .first{border-radius:10px 0 0 10px;-webkit-border-radius:10px 0 0 10px; -moz-border-radius:10px 0 0 10px;}
#nav .last{border-radius:0px 10px 10px 0;-webkit-border-radius:0px 10px 10px 0; -moz-border-radius:0px 10px 10px 0;}
#nav ul li{float:left;border:solid #000;border-width:1px 0 1px 1px;background:black url('../images/navbg.gif');overflow:hidden}
#nav ul li:hover{background:#f68f1e url('../images/activebg.gif')}
#nav ul li a:link{text-transform:uppercase; text-decoration:none; font-family:serif; font-size:10pt; font-weight:bold; color:#fff; width:100px; height:40px; display:block; text-align:center; padding-top:10px}
#nav ul li a:hover{color:#000;text-decoration:underline;}
#nav ul ul{ position:absolute; }

我的标记是这样的：

<div id="nav">
                            <ul>
                                <li class="first"><a class="first" style="<?php if($page == "home") print "background:#f68f1e url('images/activebg.gif');color:#000";?>" href="?page=home">Home</a></li>
                                <li><a href="?page=about" style="<?php if($page == "about") print "background:#f68f1e url('images/activebg.gif');color:#000;";?>">About</a>
                                    <ul>
                                        <li><a href="?page=about">Testimonies</a></li>
                                    </ul>
                                </li>
                                <li><a href="?page=resources" style="<?php if($page == "resources") print "background:#f68f1e url('images/activebg.gif');color:#000;";?>">Resources</a></li>
                                <li><a href="?page=videos" style="<?php if($page == "videos") print "background:#f68f1e url('images/activebg.gif');color:#000;";?>">Videos</a></li>
                                <li class="last"><a href="?page=contact" class="last" style="<?php if($page == "contact") print "background:#f68f1e url('images/activebg.gif');color:#000";?>">Contact</a></li>
                            </ul>
                        </div>

Answer 1

如果您说徽标+导航与实际内容之间的间距，则需要降低样式表的.header类中的高度值。

Answer 2

我明白了。我只是从头开始重写了整个导航。然后我决定取消下拉菜单并将其放在侧面导航中。

为什么我在下拉菜单下面得到额外的填充？

2 个答案: