怎么设置让鼠标浮动到链接上框内都变红色，除了用图片设为背景

Question

<div id=nav>

    <ul class="list">

        <li><a href="">我们是谁</a></li>

        <li><a href="">我们的文化</a></li>

        <li><a href="">我们的愿景</a></li>

    </ul>

</div>

css

#nav li{float: left;margin-top:6px ;height: 36px;width: 180px;border: 1px solid #333;line-height: 36px;font-size: 14px;font-weight: bold;display: block;}

#nav li a:hover{background-color: red;color: white;}

Answer 1

把a设置成块，继承父级宽高，#nav li a:hover{background-color: red;color: white;display:block;width:100%;height:100%}

Answer 2

#nav li:hover{background-color: red;color: white;}或者a display：block;设置与li一样大