为什么我的链接导航中会显示额外的项目符号?

时间:2015-09-16 16:49:18

标签: html css html5 css3

我的所有网站都有相同的基本导航结构。您可以告诉我,在我们与我的网站上的像素之间有一个空格:http://thenewfilmsandfluff.blogspot.com/2015/09/hitman-47.html

鉴于我在所有相关网站上看起来都是这样的,我认为足以包含相关结构的HTML和CSS。我使用高级模板布局用CSS标记我的HTML。

这就是我的导航部分HTML的样子 - 我已经在评论中做到了这样它仍然可以显示。

 Context:  this is the code navigation for my website.  
     <!--<section id="nav">
    <nav><ul>
    <li><a href="#">Hitman 47!!</a></li>
    <li><a href="#">Minions!!  </a></li>
      <li><a href= #">Selected Reviews #1</a></li>
      <li><a href="#">Terminator Genisys</a></li>
    <li><a href="#">Adjustment Bureau</a></li>
    <li><a href="#">Jurassic World</a></li>
    <li><a href="#">Inside Out</a></li>
    <li><a href="#">Star Wars IV: A New Hope</a></li>
    <li><a href="#">Star Wars V:  The Empire Strikes Back</a></li>
      <li><a href="#">Contact</a><li>
    <li><a href="#">Pixels!</a></li></ul></nav>

I've included the # to denote examples.  

 </section> -->

    And here is the CSS for the section

/*
h2{color:  #00CCFF; border: 1px; background-color:  blue; border-radius: 10px; -MOZ-BORDER-RADIUS:  10PX; -webkit-border-radius:  10px; -moz-box-shadow:  10px 10px; -webkit-box-shadow:  10px 10px;  }
h2.style{font-size: 35px;}
p.style2{font-size:  20px; color: #0000FF !important; font-family:  ariel, times new-roman; background-color: lawngreen;}
body{background-color: beige;}
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

a {
    display: inline;
    width: 60px;
    background-color: #dddddd;

body{background-color:  mediumpurple;}

}

a:link{color:  #CC3300; }
a:visited{color:  #D14719;}
a:hovor{color:  #D65C33; background-color: blueviolet;}
a:active{color: #661A00;}

section#main{float: left;
    width: 70%;}
Section#nav{float:right;
width:  20%;}*/

我可以做什么?

2 个答案:

答案 0 :(得分:0)

你没有关闭联系人的li标签

<li><a href="#">Contact</a><li>
<li><a href="#">Contact</a></li>

你错过了href的双倍报价

<li><a href= #">Selected Reviews #1</a></li>

:)

答案 1 :(得分:0)

<li><a href="#">Contact</a><li> //(You didnt close the li tag for contact)

It should be like this:

<li><a href="#">Contact</a></li>

现代浏览器会自动解析html并关闭未关闭的标记,使其呈现如下:

<li><a href="#">Contact</a></li> and empty list item <li></li>