0

すべてのフッターに表示される上部のナビゲーションバー「image4」に最後のリンクがあります。したがって、フッターの上にマウスを置くと、最後の<li>アイテムのハイパーリンクがトリガーされます。

何らかの理由で、image4リンクがフッターまで下がっているように見えます。image4アイテムを削除すると<li>、image3は、フッターのどこからでもトリガーできる新しいリンクになります。

どうすればこれを解決できますか？

私のコードは次のとおりです。

HTML：

</head>

<body>
    <div id="wrapper">

        <div id="nav">  
            <ul>
                <li><a href="http://www.com/" target="blank" class="image1"><img alt="#" src="image1.png" /></li>
                <li><a href="http://www.com/" target="blank" class="image2"><img alt="#" src="image2.png" /></li>
                <li><a href="http://www.com/" target="blank" class="image3"><img alt="#" src="image3.png" /></li>
                <li><a href="http://www.com/" target="blank" class="image4"><img alt="#" src="image4.png" /></li>
            </ul>
        </div><!-- end of the nav -->

        <div id="content">
            <img alt="#" class="image5" src="image5.png" />
            <img alt="#" class="image6" src="image6.png" />
        </div><!-- end of the content -->

    </div><!-- end of the wrapper -->
</body>

<footer>
    <img class="logo" alt="#" src="logo.png" />
    <p>© 2012<?php echo date('Y'); ?> logo studio. All rights reserved.</p>
</footer>

</html>

CSS：

*{
    margin: 0px;
    padding: 0px;
}

body {
    margin: 0px;
    background: url('images/bg.png') repeat-x;
    background-color: #ffffeb;
}

#nav {
    float: left;
    width: 1024px;
    height: 732px;
    display: block;
    margin: 5px 0 0 200px;
}

ul {
    list-style: none;
    width: 420px;
    margin: 0 auto;
}

li {
    float: left;
}

.image5 {
    position: absolute;
    top: 0px;
    left: 200px;
    z-index: -1;
}

.image6 {
    position: absolute;
    top: 375px;
    left: 200px;
    z-index: -1;
}

footer {
    height: 30px;
    position: relative;
    top: 715px;
}

.logo {
    position: absolute;
    left: 230px;
    top: 0px;
}

p {
    font-family: helvetica, arial, sans serif;
    font-size: 12px;
    color: #aaaaaa;
    text-decoration: none;
    position: absolute;
    left: 940px;
    top: 0px;
    padding: 5px;
}
4

3 に答える 3

0

フッタータグ（および他のほとんどすべてのタグ）は、ボディタグの内側に配置する必要があります。

<html>
<head>
<!--allows: meta, title, script and style -->
</head>
<body>
<!--allows every other tag, including script, style, li, ul, ol, b, i, u, hr, h1-h5, table,     etc...... -->
</body>
</html>

それ以外は、image4グラフィックがフッターに表示される理由がわかりません= S

于 2012-08-06T14:44:28.187 に答える
0

の終了タグの「/」を忘れました<a>。クローズタグはのようになります</a>。

于 2012-08-06T14:49:32.297 に答える
0 
        <head>
        </head>

        <body>
            <div id="wrapper">

                <div id="nav">  
                    <ul>
                        <li><a href="http://www.com/" target="blank" class="image1"><img alt="#" src="image1.png" /> </a></li>
                        <li><a href="http://www.com/" target="blank" class="image2"><img alt="#" src="image2.png" /></a></li>
                        <li><a href="http://www.com/" target="blank" class="image3"><img alt="#" src="image3.png" /></a></li>
                        <li><a href="http://www.com/" target="blank" class="image4"><img alt="#" src="image4.png" /></a></li>
                    </ul>
                </div><!-- end of the nav -->

                <div id="content">
                    <img alt="#" class="image5" src="image5.png" />
                    <img alt="#" class="image6" src="image6.png" />
                </div><!-- end of the content -->

           <footer>
            <img class="logo" alt="#" src="logo.png" />
            <p>© 2012<?php echo date('Y'); ?> logo studio. All rights reserved.</p>
           </footer>

            </div><!-- end of the wrapper -->



        </body>



        </html>​
于 2012-08-06T14:54:53.387 に答える