탭 메뉴 클릭 시 다른 탭메뉴 클릭 전까지 글자 색상이 빨강으로 변한상태로 있게 하고 싶습니다.
그리고 탭메뉴의 첫메뉴가 눌러져 있게 하고 싶습니다. hover을 이용해서 해봤는데 잘안되더군요.ㅜ
도와주시면 감사합니다...
Copy
/* Style the tab */
.tab {
overflow: hidden;
border: 0px solid #ccc;
background-color: #ffffff;
border-top:1px solid #dfe3eb;
border-right:1px solid #dfe3eb;
border-left:1px solid #dfe3eb;
}
/* Style the buttons that are used to open the tab content */
.tab button {
background-color: inherit;
margin-left:16px;
margin-top:10px;
float: left;
border: none;
outline: none;
cursor: pointer;
padding: 14px 16px;
transition: 0.3s;
font-weight:bold;
}
/* Change background color of buttons on hover */
.tab button:hover {
background-color: #ffffff;
color:#4f46ba; !important;
}
.tab input:focus {background-color: red;}
/* Create an active/current tablink class */
.tab button.active {
background-color: #ccc;
}
/* Style the tab content */
.tabcontent {
display: none;
padding: 6px 12px;
border: 1px solid #ccc;
border-top: none;
}
|
답변 2개 / 댓글 3개
채택된 답변
+20 포인트
병원에서일해요
2021-05-10 (월) 10:19:20
원하시는 기능은 css만으론 안되고
스크립트를 이용해서 클래스 제어해주셔야될거같네요
클래스를 이용해서 on off 기능을 만들어보세요
답변에 대한 댓글 2개
병원에서일해요
2021-05-10 (월) 10:21:14
stunningw그게 저도 시도를 해보았는데 이경우 php코드 내에서 1번 php 페이지가 열렸을때 1번 메뉴의 색상이 변하고 나머지는 그대로이다 라는 형식을 적는 방법이 있고 다른방법은... 너무 어려워서 잘 모르겠더라고요 일단은
css에서는 active나 여러 것을 이용해보아도 안되었고 php로 작동 시키는 방법에 대해 연구 해보셔야할것같습니다 ㅠㅠ
답변에 대한 댓글 1개
답변을 작성하려면 로그인이 필요합니다.
active에 글자색 변경해주도록 추가해주시면 되고
최초에 첫번째탭 활성화시키는건 첫번째 탭에 active 클래스 넣어주면 되겠네요