                        課程
                    
                        /前端開發(fā)
                        
                            /HTML/CSS
                        
                        /星級評分原理和實現(xiàn)（下）

為什么點擊后鼠標經(jīng)過不能熄滅了。為什么視頻里面出現(xiàn)兩次.rating-item:hover{ } ?????

?????.rating{
????????position:relative;
????????width:240px;
????????height:45px;????????
????????margin:250px?auto;
????????background:url(images/icon.png)?repeat-x;
?????}
?????.rating-item{
????????position:absolute;??
????????top:0;
????????z-index:?3;
????????width:48px;
????????height:45px;
?????}
?????.rating-item-1{
????????left:0px;
?????}
?????.rating-item-2{
????????left:48px;
?????}
?????.rating-item-3{
????????left:96px;
?????}
?????.rating-item-4{
????????left:144px;
?????}
?????.rating-item-5{
????????left:192px;
?????}

?????.rating-item-1:hover,#rating-1:checked?+?.rating-item{
?????????width:48px;
?????}
?????.rating-item-2:hover,#rating-2:checked?+?.rating-item{
?????????width:96px;
?????}
?????.rating-item-3:hover,#rating-3:checked?+?.rating-item{
?????????width:144px;
?????}
?????.rating-item-4:hover,#rating-4:checked?+?.rating-item{
?????????width:192px;
?????}
?????.rating-item-5:hover,#rating-5:checked?+?.rating-item{
????????width:240px;
?????}
?????.rating-item?label{
????????display:inline-block;
????????width:100%;
????????height:100%;
????????cursor:?pointer;
?????}??
?????.rating?input:checked?+?.rating-item{
????????left:0;
????????background:url(images/icon.png)?repeat-x?0?-45px;
????????z-index:1;
?????}
??.rating-item:hover{
????????left:0;
????????z-index:?2;
????????background:url(images/icon.png)?repeat-x?0?-45px?;
?????}
?????.rating:hover?.rating-item{
????????background-image:none;
?????}
???????.rating-item:hover{
???????
????????background:url(images/icon.png)?repeat-x?0?-45px?!important;}
????????
????.rating?input:checked?+?.rating-item?~?.rating-item:hover{
????????z-index:?0;
?????}