[Do it! HTML+CSS+자바스크립트 웹 표준의 정석] 6장 연습문제
Do it! HTML+CSS+자바스크립트 웹 표준의 정석 - 6장 연습문제 2개
Dec 25, 2023
quiz-1
quiz-1.html
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>상품 소개 페이지</title> <link rel="stylesheet" href="css/mystyle.css"> </head> <body> <h1>웹 기술 - 기본</h1> <ul> <li>HTML</li> <li>CSS</li> <li>Javascript 기초</li> </ul> </body> </html>
mystyle.css
h1 { display: inline-block; font-size:1.4em; background-color:#222; color:#fff; padding:10px; } ul { list-style:none; } li { font-size:1.2em; line-height:1.5; color:blue; }
result
quiz-2
quiz-2.html
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>탐라국 입춘굿</title> <style> #container { width: 600px; margin: 20px auto; border: 1px solid black; font-family: "맑은 고딕", 돋움, 굴림; } h1{ display: inline-block; background-color: #0404aa; color: #fff; } .accent{ font-size: large; font-weight: 900; color: red; font-style: italic; } </style> </head> <body> <div id="container"> <h1>탐라국 입춘굿</h1> <p>제주도의 문화축제 중에서 유일하게 <span class="accent">전통시대부터 존재했던 축제</span>이다.</p> <p>제주에서 입춘은 새철<sup>(제주어, 샛절)</sup> 드는 날. <br> 하늘의 1만8000신이 지상으로 내려와 새해 일들을 시작하는 때다. </p> </div> </body> </html>
result
Share article