首页 > 代码库 > css - a:hover变色问题

css - a:hover变色问题

今天在帮我们学校做网站的时候,由于在css这里不是很擅长,过程中发现一个问题,a:hover的时候,字体的颜色不变.后来才发现将a和div的嵌套的问题,

我的css代码为:

.left_box .lb_wrap .lb_theme {    color:#900;    text-align:center;    height:30px;    display: block;;    margin-left: auto;    margin-top: 1px;    line-height: 35px;}.left_box .lb_wrap  a {    display:block;    text-align:center;    height:30px;    width:100%;}.left_box .lb_wrap a:link {    color:#900;    background: #FFF no-repeat 5px 12px;    text-decoration:none;}.left_box .lb_wrap  a:hover {    color:#FFF;  /*鼠标滑过的时候,字体应该变为该色调(白色),但是实际上没有*/    background:#800  no-repeat 5px 12px;    font-size: 12px;    font-weight: bolder;    text-decoration:none;}.left_box {    border: 1px solid #09F;    margin-top: 16px;}/*lb:left box*/.left_box .lb_wrap {    width:95%;    background:#900;    margin-top:5px;    margin-left: auto;    margin-bottom:30px;    font: Arial, "宋体";}

html代码为:

<div class="left_box"><div class="lb_wrap">    <div class="lb_title">国家、广西特色专业</div>    <a href="/Item/88951.aspx">    <div class="lb_theme">地理信息系统</div> <!--div不能放在div中,否则a:hover不起作用-->    </a>    <div class="lb_theme"><a href="/Item/88943.aspx">地理科学(教师教育)</a></div></div>

 

css - a:hover变色问题