tkddnjs1018

말씀하신대로 scss안에 .active를 넣었는데도 적용이 안돼요,,도대체 무엇이 문제인지 모르겠네요 논리적으로 봤을때 .active를 html에서 btn과 tabs 밑에 넣었을때 작동을 해야 하는데 왜 안되는지 이유가 궁금합니다 ,, 다른 부분은 다 작동을 하는데 말이에요 ㅠㅠsection{
 width: 800px;
 
 .tab-inner{
 margin-top: 30px;
 .btn{
 list-style: none;
 padding: 0;
 margin: 0;
 overflow: hidden;
 li{
 float: left;
 // border: 1px solid #000;
 width: 120px;
 text-align: center;
 cursor: pointer;
 background-color: #eee;
 border-right: 1px solid #ddd;
 padding: 5px;
 border-top: 2px solid transparent;
 transition: 0.3s;
 &:last-child{
 width: 170px;
 border-right: none;
 }
 &:hover{
 background-color: #fff;
 border-top: 2px solid crimson;
 }
 .active{
 background-color: #fff;
 border-top: 2px solid crimson;
 }
 }
 }
 .tabs{
 
 div{
 background-color: #fff;
 padding: 20px;
 box-sizing: border-box;
 height: 200px;
 display: none;
 .active{
 display: block;
 }
 }
 }
 }
}<pre><code class="language-scss"></code></pre>

tkddnjs1018

投稿