保证金问题与导航栏打破照片幻灯片

时间:2014-08-22 02:23:31

标签: html css

我有点麻烦让我的导航栏设置我想要的样式。出于某种原因,我的导航栏失去了它的底部边框,当我尝试CSS导航背景时它没有任何效果,如果我使用边距(底部),那么Wowslider会变得疯狂,当它改变图像时它变得非常大。

它必须在我的CSS中,但我会发布我的HTML和CSS。我希望导航栏看起来像是enter image description here

但我需要首先解决上述问题(甚至不确定导航栏的类型是否可行)

HTML

 <?php include 'header.php';?>
 <div class="logo"> Darthvix Custom Sabers specializes in custom lightsabers and conversions to create a unique lightsaber specific to you're desires.<P></P></div>
        <!-- Start WOWSlider.com BODY section --> <!-- add to the <body> of your page -->
    <div id="wowslider-container1">
    <div class="ws_images"><ul>
<li><img src="data1/images/dsc01061.jpg" alt="DSC01061" title="DSC01061" id="wows1_0"/></li>
<li><img src="data1/images/dsc01069.jpg" alt="DSC01069" title="DSC01069" id="wows1_1"/></li>
<li><img src="data1/images/dsc01114.jpg" alt="DSC01114" title="DSC01114" id="wows1_2"/></li>
<li><img src="data1/images/dsc01140.jpg" alt="DSC01140" title="DSC01140" id="wows1_3"/></li>
<li><img src="data1/images/dsc01273.jpg" alt="DSC01273" title="DSC01273" id="wows1_4"/></li>
<li><img src="data1/images/dsc01285.jpg" alt="DSC01285" title="DSC01285" id="wows1_5"/></li>
</ul></div>
<div class="ws_bullets"><div>
<a href="#" title="DSC01061"><img src="data1/tooltips/dsc01061.jpg" alt="DSC01061"/>1</a>
<a href="#" title="DSC01069"><img src="data1/tooltips/dsc01069.jpg" alt="DSC01069"/>2</a>
<a href="#" title="DSC01114"><img src="data1/tooltips/dsc01114.jpg" alt="DSC01114"/>3</a>
<a href="#" title="DSC01140"><img src="data1/tooltips/dsc01140.jpg" alt="DSC01140"/>4</a>
<a href="#" title="DSC01273"><img src="data1/tooltips/dsc01273.jpg" alt="DSC01273"/>5</a>
<a href="#" title="DSC01285"><img src="data1/tooltips/dsc01285.jpg" alt="DSC01285"/>6</a>
</div></div><span class="wsl"><a href="http://wowslider.com">slideshow</a> by WOWSlider.com v5.6m</span>
    <div class="ws_shadow"></div>
    </div>  
    <script type="text/javascript" src="engine1/wowslider.js"></script>
    <script type="text/javascript" src="engine1/script.js"></script>
    <!-- End WOWSlider.com BODY section -->
                 <?php include 'footer.php';?>

</body>

    </html>

CSS

body {
    width:100%;
    overflow-x:hidden;
  /* This image will be displayed fullscreen */
    background:url('../images/background.jpg') no-repeat center center;


    /* The Magic */
    background-size:4000px 4000px;

}
div.entire {
    width:85%;
    background-color: #383838;
    margin:auto;
    color:#33FF00 ;
    min-height:100%;

}

a { 
    color: #33FF00;
}
a.visited, a.hover {
    color: #33FF00 ;
}

div.logo {
    font-size:150%;
    text-align:center;
}
div.wowslider {
    width:100%;
}
#navbar {
            background-color:#505050;
}
#menu {
    width: 100%;
    margin: 0 0 2em 0;
    padding: 0;
    list-style: none;
    border-bottom: 1px solid #ccc; 
    border-top: 3px solid #ccc; 
    font-size: 150%;
    box-shadow: 8px 8px 8px #888888;
    background-color:#505050;

}

#menu a {
    text-shadow: 3px 3px black;
}
#menu li {
    float: left; 
}
#menu li a {
    display: block;
    padding: 8px 15px;
    text-decoration: none;
    font-weight: bold;
    color: white;
    border-right: 4px solid #ccc;
     }
#menu li a:hover {
    color: white;
    background:url('../images/navbackground.jpg'); }


div.footer {
    border-top: 1px solid white; 
    background-color: #404040    ; 
    width:100%;
    height:auto !important;
    margin:auto;
    clear:both;
}
#about {
    width:60%;
    font-size:130%;
}


div.buildlog {
    font-size:220%;
    font-weight:bold;
}

.build {
    font-size:170%;
    font-weight:bold;

}
.builds {
    font-size:130%;
}
div.forsalepics img {
    width:20%;
    height:30%;
    margin:2%;
    border: 3px solid white;

}
div.servicewidth {
width:60%;
}
div.services, div.payment {
    font-size:170%;
    font-weight: bold;
}

1 个答案:

答案 0 :(得分:0)

我修好了,把一些导航条码放在错误的地方!!!