hover했을 때 보이게 하려면 어떤식으로 해야할까요?

우선 제가 했던 css, html코드 첨부합니다(checked가 아닌 제가 질문글에 올린 의도대로 수정해서 해보았던 거예요!) 문제점은 1번째 요소에 계속해서 빨간색으로 버튼이 칠해져있다는 겁니다.. 그냥 hover로 해결할 수 있긴한데 그러면 기본적으로 첫번째 요소에 hover되어 있게 어떻게 해야하나요??(checked자리에 hover넣으면 될줄 알았는데 안돼더라고요.) @import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic&display=swap'); body { font-family: 'Nanum Gothic', sans-serif; height: 100vh; display: flex; justify-content: center; align-items: center; margin: 0; background-color: #f8f9fa; } .tapmenu { width: 300px; height: 330px; position: relative; } input { display: none; } .images span{ position: absolute; top:0; left:0; transition: .5s; opacity:0; visibility: hidden; } .btn { position: absolute; bottom: 0; width: 300px; height: 20px; text-align: center; } .btn label { display: inline-block; width: 20px; height: 20px; background-color: grey; margin-right: 5px; border-radius: 50%; transition: .3s; } input[id=tap1]:checked ~ .btn label[for=tap1] { background-color: red; } input[id=tap2]:hover ~ .btn label[for=tap2] , input[id=tap3]:hover ~ .btn label[for=tap3] { background-color: red; } input[id=tap1]:checked ~ .images span:nth-child(1) { opacity:1; visibility: visible; } input[id=tap2]:hover ~ .images span:nth-child(2) , input[id=tap3]:hover ~ .images span:nth-child(3) { opacity:1; visibility: visible; } form Example 2 (사진) (사진) (사진)

a태그 같은 위치에 정렬

pseudo Example 1 Online Class

p태그 수직중앙정렬

hover Example 4 (사진) Mars 화성은 태양계의 네 번째 행성이다. 4개의 지구형 행성 중 하나다. 동양권에서는 불을 뜻하는 화(火)를 써서 화성이라 부르고 로마 신화의 전쟁의 신 마르스의 이름을 따 Mars라 부른다. Read More (사진) Jupiter 목성은 태양계의 다섯번째 행성이자 가장 큰 행성이다. 태양의 질량의 천분의 일배에 달하는 거대행성으로, 태양계에 있는 다른 모든 행성들을 합한 질량의 약 2.5배에 이른다. Read More (사진) Saturnus 토성은 태양으로부터 여섯 번째에 있는 태양계의 행성으로, 진성(鎭星)으로도 불렀다. 토성은 태양계 내의 행성 중 목성에 이어 두 번째로 크며, 지름은 약 12만 킬로미터이다. Read More

hover했다가 마우스를 뗐을 때

아래가 html소스코드입니다. 그리고 아래 질문도 답변 부탁드립니다 호버했다가 떼는 순간에 보이는 back부분 텍스트 잔상이라 스크린샷하기가 어렵습니다. hover Example 4 (사진) Mars 화성은 태양계의 네 번째 행성이다. 4개의 지구형 행성 중 하나다. 동양권에서는 불을 뜻하는 화(火)를 써서 화성이라 부르고 로마 신화의 전쟁의 신 마르스의 이름을 따 Mars라 부른다. Read More (사진) Jupiter 목성은 태양계의 다섯번째 행성이자 가장 큰 행성이다. 태양의 질량의 천분의 일배에 달하는 거대행성으로, 태양계에 있는 다른 모든 행성들을 합한 질량의 약 2.5배에 이른다. Read More (사진) Saturnus 토성은 태양으로부터 여섯 번째에 있는 태양계의 행성으로, 진성(鎭星)으로도 불렀다. 토성은 태양계 내의 행성 중 목성에 이어 두 번째로 크며, 지름은 약 12만 킬로미터이다. Read More