微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

使整体与正确的HTML链接

我知道这已经很多次了,但是在我的具体情况下找不到任何解决方案.

我有一个导航栏,如果你愿意,我希望整个< li>被“链接”或“可点击”.现在只有< a> (和< div>我已经搞砸了)是“可点击”.

我试过了一个{display:inner-block;身高:100%; width:100%}方法,但结果只是可怕的.

来源可以在这里找到:http://jsfiddle.net/prplxr/BrcZK/

HTML

<!DOCTYPE html>
<html>
    <head>
        <title>asdf</title>
    </head>
    <body>
        <div id="wrapper">
            <div id="menu">
                <div id="innermenu">    
                    <ul id="menulist">       
                        <li class="menuitem"><a href="index.PHP"><div class="menulink">Lnk1</div></a></li>
                        <li class="menuitem"><a href="index.PHP"><div class="menulink">Lnk2</div></a></li>
                        <li class="menuitem"><a href="index.PHP"><div class="menulink">Lnk3</div></a></li>
                        <li class="menuitem"><a href="index.PHP"><div class="menulink">Lnk4</div></a></li>
                    </ul>
                </div>
            </div>
        </div>
    </body>
</html>

有谁有一个整洁的解决方案吗?

先谢谢你!

解决方法

>摆脱< div> s.
>将< a>标签显示:block
>从< li>移动填充到< a>.
>< li> s需要被浮动或显示:inline-block

示例:http://jsfiddle.net/8yQ57/

原文地址:https://www.jb51.cc/html/230630.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐