"이청원 자료실"의 두 판 사이의 차이
North Korea Humanities
| 1번째 줄: | 1번째 줄: | ||
{{버튼클릭|[[LeeCheongWonDigitalArchive|<font color="white">이청원 디지털 아카이브로 이동하기</font>]]|color=blue}} | {{버튼클릭|[[LeeCheongWonDigitalArchive|<font color="white">이청원 디지털 아카이브로 이동하기</font>]]|color=blue}} | ||
| + | <html> | ||
| + | <head> | ||
| + | <meta charset="UTF-8"> | ||
| + | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| + | <title>자료 목록</title> | ||
| + | <link rel="stylesheet" href="styles.css"> <!-- 별도 스타일링 CSS --> | ||
| + | </head> | ||
| + | <body> | ||
| + | <header> | ||
| + | <div class="container"> | ||
| + | <h1>자료 목록</h1> | ||
| + | <p>여기는 다양한 자료들이 정리된 위키 스타일의 목록입니다. 각 항목을 클릭하여 더 많은 정보를 확인하세요.</p> | ||
| + | </div> | ||
| + | </header> | ||
| − | < | + | <main> |
| − | + | <section class="grid-container"> | |
| − | + | <!-- 카드 아이템 1 --> | |
| − | + | <div class="card"> | |
| − | + | <img src="image1.jpg" alt="아이템 1" class="card-img"> | |
| − | + | <div class="card-body"> | |
| − | + | <h2 class="card-title">자료 제목 1</h2> | |
| − | + | <p class="card-description">여기에 자료에 대한 간단한 설명이 들어갑니다.</p> | |
| − | + | ||
| − | + | </div> | |
| − | + | </div> | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | </ | ||
| + | <!-- 카드 아이템 2 --> | ||
| + | <div class="card"> | ||
| + | <img src="image2.jpg" alt="아이템 2" class="card-img"> | ||
| + | <div class="card-body"> | ||
| + | <h2 class="card-title">자료 제목 2</h2> | ||
| + | <p class="card-description">이 항목에 대한 간단한 설명입니다.</p> | ||
| + | |||
| + | </div> | ||
| + | </div> | ||
| + | |||
| + | <!-- 카드 아이템 3 --> | ||
| + | <div class="card"> | ||
| + | <img src="image3.jpg" alt="아이템 3" class="card-img"> | ||
| + | <div class="card-body"> | ||
| + | <h2 class="card-title">자료 제목 3</h2> | ||
| + | <p class="card-description">이 항목에 대한 설명을 추가합니다.</p> | ||
| + | |||
| + | </div> | ||
| + | </div> | ||
| + | </section> | ||
| + | </main> | ||
| + | </body> | ||
| + | </html> | ||
[[분류:LCWDA]] | [[분류:LCWDA]] | ||
