ProgramingTip

div 호버 배경색 변경?

bestdevel 2020. 11. 7. 10:18
반응형

div 호버 배경색 변경?


div 라인이 앵커 인 것처럼 작동하도록 만들 수 있습니다 마우스를 올려 놓으면 빨간색으로 돌아갑니다.

CSS

.e
{
    width:90px;
    border-right:1px solid #222;
    text-align:center;
    float:left;
    padding-left:2px;
    cursor:pointer;


}
.f .e
{
    background-color:#F9EDBE;

}

HTML

<div>
    <div class="e" >Company</div>
    <div class="e">Target</div>
    <div class="e" style="border-right:0px;">Person</div>
</div>         
<div class="f">
    <div class="e">Company</div>
    <div class="e">Target</div>
    <div class="e" style="border-right:0px;">Person</div>
</div>   
<div>
    <div class="e">Company</div>
    <div class="e">Targetaaa</div>
    <div class="e" style="border-right:0px;">Person</div>
</div>            
<div class="f"> 
    <div class="e">Company</div>
    <div class="e">Target</div>
    <div class="e" style="border-right:0px;">Person</div>
</div>  


.e:hover{
   background-color:#FF0000;
}

단순히 :hoverpseudo- 를 추가했을 때 개 색상을 변경하려면

div.e:hover {
    background-color:red;
}

div 호버 배경색 변경

다음과 같이 시도하십시오.

.class_name:hover{
    background-color:#FF0000;
}

참고 URL : https://stackoverflow.com/questions/9266669/div-hover-background-color-change

반응형