Question

CSS如何实现列表栏制作，鼠标经过变色

CSS实现列表栏制作，鼠标经过变色，现在我写的代码，鼠标只有放置在我加的图片上，图片背景也变色，我想实现这个这一列变色却不行，是我代码哪里写错了吗
html中列表代码
<ul class="todo-list">
<li>
<span class="todo-actions">
<a href="#"><i class="icon-check-empty"></i></a>
</span>
<span class="desc">前车体1#</span>
<span class="label label-important" >today</span>
</li>
其中部分css代码
.todo ul li .todo-actions {
position: absolute;
left: 0;
margin-top: 2px
}
.todo ul li .todo-actions i:hover {
background-color: #36a9e1
}

Answer 1

实现标题栏鼠标滑过点击过后保持原色，不用像你那样写得这么复杂，按照你说的，只需要写一次样式就够了，写法如下： #dh ul li a { display:block; background:#006ead; width:125px; height:43px; } 现在我无论是在默认状态下、鼠标移上去时、鼠标点击时，或是点击过后，a标签背景颜色都会保持在初始状态，不会改变。 如果需要鼠标移上去时，背景变色，那就加多一条a:hover，写法如下： #dh ul li a:hover{ display:block; background:#0193de; width:125px; height:43px; } 现在就只有鼠标移上去时背景会变色，其他情况颜色都不会变化。 提示：如果需要文字一直保持原色，只需要在第一条#dh ul li a 的代码里加上一条“color:颜色属性”即可。例如：#dh ul li a {background:#006ead;color:#fff} 试一试吧！

Answer 2

你想实现的是哪一列变色？你现在想变色的位置只是个icon

Answer 3

你的hover应该是设置给li的，而不是设置给其他的元素