这是一个简单的菜单结构:
<ul id="menu">
<li><a href="javascript:;">Home</a></li>
<li><a href="javascript:;">Test</a></li>
</ul>
Run Code Online (Sandbox Code Playgroud)
我想让它<a>被拉伸,以便它填满整个<li>.我尝试使用类似width: 100%; height: 100%但没有效果的东西.如何正确拉伸锚标签?
我想这样做,以便标签上的可点击区域的大小LI.
我的HTML看起来像:
<li>
<a href="#">Link</a>
</li>
Run Code Online (Sandbox Code Playgroud) 如何将锚标记扩展到列表项的底部?我知道我可以将锚点放在列表项标签上,但是这违反了XHTML 1.0严格的合规性,所以我不能这样做.
<html>
<head>
<style>
#listWrapper { text-align:center;}
#list { margin-left: 0px auto; margin-right: 0px auto; width: 100%; min-height: 100%; height:100%; margin-bottom: 10px; margin-top: 0px;}
#list ul { padding: 5px 10px 10px 10px; margin: 0; min-height: 100%;}
#list li { clear:both; font-weight:bolder; height:auto; border-bottom: 1px solid Silver; border-left: 1px solid Silver; font-size:x-small; border-right: 1px solid Silver; list-style-type: none;}
#list a:hover { background-color: red;}
#list a { display:block; cursor:pointer; text-decoration: none; text-align:left; vertical-align:top; }
#list h3 { background-color:Silver; vertical-align:top; font-size:larger; } …Run Code Online (Sandbox Code Playgroud)