[CSS] Transition Hover Opacity 효과

by 
.m_box_one:{
}
.before{
	opacity:1;
	visibility:visible;
  transition: opacity 0.3s, hidden 0.3s;
}
.before .after{
	opacity:0;
	visibility:hidden;
  transition: opacity 0.3s, visibility 0.3s;
}
.before .m_box_one:hover .m_after{
  visibility: visible;
  opacity: 1;
  transition: opacity 0.3s, visibility 0.3s;
}
.m_box_one:hover .m_before{
 visibility:hidden;
	opacity:0;
  transition: opacity 0.3s, hidden 0.3s;
}
<div class="m_box_one">
    <div class="m_after">
    </div>
    <div class="m_before">
    </div>
</div>

Leave a Comment