개발 JS, CSS, HTML로 만든 문제풀이 게시판
페이지 정보
본문
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.hide {
display: none;
}
.myDIV:hover + .hide {
display: block;
color: red;
}
.question{ font-size: 20px; padding-top:20px;}
.correct:hover{ color:blue; font-size: 18px;}
.answer{ font-size: 18px; padding: 5px 10px;}
.hide{ font-size: 18px;padding-left:30px;}
/* .problem{ border: solid #E0D4D4 thin;}*/
</style>
</head>
<body>
<div class="problem">
<p class="question">1. Who is the best man in the world?</p>
<div class="answer">1. Joe Biden</div>
<div class="answer">2. Ronald Reagon</div>
<div class="answer">3. Bill Clington</div>
<div class="myDIV correct answer">4. Kimchulyong</div>
<div class="hide">I am shown when someone hovers over the div above.</div>
</div>
<div class="problem">
<p class="question">2. 프런트 프로그래밍에서 꼭 배워야 할 것은?</p>
<div class="answer">1. HTML</div>
<div class="answer">2. CSS</div>
<div class="answer">3. DataBase</div>
<div class="myDIV correct answer">4. Javascript</div>
<div class="hide">At a front devellopes, Javascript is necessary!!</div>
</div>
<div class="problem">
<p class="question">3. 허블망원경을 대체하려고 나사에서 쏘아올린 우주망원경?</p>
<div class="answer">1. 갈릴레오 망원</div>
<div class="answer">2. Ronald Reagon</div>
<div class="answer">3. Bill Clington</div>
<div class="myDIV correct answer">4. 제임스웹 망원</div>
<div class="hide">나사국장이었든 제임스웹의 이름을 따서 만든 제임스웹 우주망원경입니다.</div>
</div>
<div class="problem">
<p class="question">4. 프런트 프로그래밍에서 꼭 배워야 할 것은?</p>
<div class="answer">1. HTML</div>
<div class="answer">2. CSS</div>
<div class="answer">3. DataBase</div>
<div class="myDIV correct answer">4. Javascript</div>
<div class="hide">At a front devellopes, Javascript is necessary!!</div>
</div>
</body>
</html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.hide {
display: none;
}
.myDIV:hover + .hide {
display: block;
color: red;
}
.question{ font-size: 20px; padding-top:20px;}
.correct:hover{ color:blue; font-size: 18px;}
.answer{ font-size: 18px; padding: 5px 10px;}
.hide{ font-size: 18px;padding-left:30px;}
/* .problem{ border: solid #E0D4D4 thin;}*/
</style>
</head>
<body>
<div class="problem">
<p class="question">1. Who is the best man in the world?</p>
<div class="answer">1. Joe Biden</div>
<div class="answer">2. Ronald Reagon</div>
<div class="answer">3. Bill Clington</div>
<div class="myDIV correct answer">4. Kimchulyong</div>
<div class="hide">I am shown when someone hovers over the div above.</div>
</div>
<div class="problem">
<p class="question">2. 프런트 프로그래밍에서 꼭 배워야 할 것은?</p>
<div class="answer">1. HTML</div>
<div class="answer">2. CSS</div>
<div class="answer">3. DataBase</div>
<div class="myDIV correct answer">4. Javascript</div>
<div class="hide">At a front devellopes, Javascript is necessary!!</div>
</div>
<div class="problem">
<p class="question">3. 허블망원경을 대체하려고 나사에서 쏘아올린 우주망원경?</p>
<div class="answer">1. 갈릴레오 망원</div>
<div class="answer">2. Ronald Reagon</div>
<div class="answer">3. Bill Clington</div>
<div class="myDIV correct answer">4. 제임스웹 망원</div>
<div class="hide">나사국장이었든 제임스웹의 이름을 따서 만든 제임스웹 우주망원경입니다.</div>
</div>
<div class="problem">
<p class="question">4. 프런트 프로그래밍에서 꼭 배워야 할 것은?</p>
<div class="answer">1. HTML</div>
<div class="answer">2. CSS</div>
<div class="answer">3. DataBase</div>
<div class="myDIV correct answer">4. Javascript</div>
<div class="hide">At a front devellopes, Javascript is necessary!!</div>
</div>
</body>
</html>
1. Who is the best man in the world?
1. Joe Biden
2. Ronald Reagon
3. Bill Clington
4. Kimchulyong
I am shown when someone hovers over the div above.
2. 프런트 프로그래밍에서 꼭 배워야 할 것은?
1. HTML
2. CSS
3. DataBase
4. Javascript
At a front devellopes, Javascript is necessary!!
3. 허블망원경을 대체하려고 나사에서 쏘아올린 우주망원경?
1. 갈릴레오 망원
2. Ronald Reagon
3. Bill Clington
4. 제임스웹 망원
나사국장이었든 제임스웹의 이름을 따서 만든 제임스웹 우주망원경입니다.
4. 프런트 프로그래밍에서 꼭 배워야 할 것은?
1. HTML
2. CSS
3. DataBase
4. Javascript
At a front devellopes, Javascript is necessary!!
추천0
- 이전글Who is Kimchulyong? 23.05.30
- 다음글자바스크립트로 만든 문제풀이 23.05.30
댓글목록
등록된 댓글이 없습니다.