HTML&CSS/실습

CSS 실습 - 탐라국 입춘굿

yunajoe 2023. 1. 20. 23:24

나의풀이

 

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <title>탐라국 입춘굿</title>
  <style>    
    #container {
        border: solid 1px black;
        width: 500px;
        margin-left:auto; 
        margin-right:auto;
        padding:10px;
        
    }  
    h1{
        display: inline-block;
        background-color: blue;
        color:white;
    }      

    .accent{          
        color:red;
    }
    
    
  </style>
</head>
<body>
  <div id="container">
    <h1>탐라국 입춘굿</h1>    
    <p>제주도의 문화축제 중에서 유일하게 <span class="accent"> 탐라 시대부터 내려온 축제</span>이다.</p>
    <p>제주에서 입춘은 새철<sup>(제주어, 샛절)</sup> 드는 날. <br>
      하늘의 1만8000신이 지상으로 내려와 새해 일들을 시작하는 때다.
    </p>
  </div>
</body>
</html>

 

해설풀이

 

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <title>탐라국 입춘굿</title>
  <style>    
    #margin{
        width:600px; 
        margin: 20px auto;
    }
     h1{
        display: inline-block;
        background-color: blue;
        color:white; 
     }    
     .accent {
        font-weight: bold; 
        color:red;
     }
  </style>
</head>
<body>
  <div id="container">
    <h1>탐라국 입춘굿</h1>    
    <p>제주도의 문화축제 중에서 유일하게 <span class="accent"> 탐라 시대부터 내려온 축제</span>이다.</p>
    <p>제주에서 입춘은 새철<sup>(제주어, 샛절)</sup> 드는 날. <br>
      하늘의 1만8000신이 지상으로 내려와 새해 일들을 시작하는 때다.
    </p>
  </div>
</body>
</html>