- test1
<!DOCTYPE html>
<html lang="ko">
<head><title>CSS</title>
<meta charset="utf-8">
<style type="text/css">
*{padding: 0; margin: 0;}
body{font: 10px "굴림", "Gulim";}
#wrapper{width: 490px; height: 500px; padding: 10px;}
#header{background: #002266; text-align: center;
padding: 5px 20px 20px 10px;}
#header h1 strong{font-size: 200%; font-weight: bold;
color: #FFFFE9;}
#header h1{color: #E8DB5F; font-family: "돋움", "dotum";}
#header h1 span{font-weight: bold; font-size: 120%;}
#header h1 em{font-weight: bold; font-size: 150%; color: #D5D5D5;
font-style: normal;}
li{list-style: none; padding: 5px; font-size: 60%;}
#menu{width: 100px; float: left; background: #D5D5D5;
padding-top: 10px; overflow: hidden;
height: 375px;}
li a{color: black; margin-left: 10px;}
#content{width: 390px; float: right;}
#content h2{padding: 5px 20px; background: #980000;
font-family: "궁서"; padding-left: 15px;
padding-bottom: 10px; color: #FFE400;
font: 10px; font-weight: normal;
}
#content p{padding: 20px; text-align: justify;}
#footer{clear: both; background: #A6A6A6; padding: 10px 20px;}
#footer address{color: black; font-style: normal; font-size: 110%;}
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
<h1><strong>호랑이</strong>를 <span>주제</span>로 한 <em>민화</em></h1>
</div>
<div id="container">
<ul id="menu">
<li><a href="#">그림의 작가</a></li>
<li><a href="#">그림의 시대</a></li>
<li><a href="#">그림의 재료</a></li>
<li><a href="#">그림의 주인공</a></li>
<li><a href="#">그림의 활용</a></li>
</ul>
<div id="content">
<h2> 승운용호도</h2>
<p> 사람 이름 같기도 한 이 그림을 처음 보았을 때 티셔츠에 새길 그림을 일러스트레이터로 작업 중이었다. 비록 그림을 보며 원본대로 그려내는 작업이었지만 즐거웠다. 용과 겨루는 황금빛 호랑이의 모습이 용맹하기도 했지만 내게는 약간 귀여워 보였고 무엇보다 순수해 보였다. 어둠 속에서 나타난 비겁한 용보다는 맑은 물을 튀며 신성한 기운을 드러내는 우리 호랑이에서 무한한 애정을 느꼈기 때문이다.</p>
<h2> 길상백호</h2>
<p> 호랑이 그림은 예로부터 아래로 내려오는 것보다 위로 올라가는 형상이 더 좋다고 하였다. 하지만 이 그림은 달랐다. 아래로 내려오고 있기는 하지만 윤기나는 등의 털과 그윽하게 쳐다보는 두 눈은 백호의 여유로움을 충분히 공감할 수 있게 해주었기 때문이다. 채도가 내려앉아 버린 백호의 그림이지만 건조해 보이기보다는 은빛으로 촉촉해 보이는 호랑이의 자태에 반했다고 할까? 알록달록함이 주는 아기자기함은 없지만 세련된 무채색에 다부지게 밟아 짚은 앞발에서 오히려 나를 지켜주는 든든함까지 느껴진다. 호랑이가 밟은 풀잎들에서도 우리를 한 공간 안에 무사히 존재하게 하는 안정감이 있는 듯하다. 그림을 감상할 때 그 시대적 배경과 소재의 재질 등을 함께 감상하여 아는 즐거움을 늘려야 하겠지만 나는 아무 부수적인 요소들을 제하고 오로지 내 눈과 그림이 서로 교감하여 빚어내는 상상의 공간을 좋아한다. 시대를 알고 의도를 아는 것도 중요하겠지만 작가가 우리에게 오로지 늘 같은 그것만 바라지는 않았을 것 같다. 심지어 바랬다고 해도 그냥 미안하게 생각하고 나만의 감상포인트를 놓치지 말아야겠다. 이것도 정체성을 잃지 않으려는 관객의 필사적인 노력으로 보아주기를 바래본다.</p>
</div>
</div>
<div id="footer">
<address>Copyright © Allright Reserved.</address>
</div>
</div>
</body>
</html>
- test 2
<!DOCTYPE html>
<html lang="ko">
<head><title>CSS</title>
<meta charset="utf-8">
<style type="text/css">
*{padding: 0; margin: 0;}
body{font: 10px "굴림", "Gulim"; padding-top: 5px;}
#wrapper{width: 480px;}
#header{width: 480px; background: #FFBB00;
text-align: center;}
#header h1 span{font-size: 8px; padding-top: 0; line-height: 0px;}
#header h1{font-size: 50px; color: white;
line-height: 40px; padding-top: 5px;}
.stit{background: #D5D5D5; padding: 5px;}
.cover{float:left;}
.sidemenu{float: left;}
.sidemenu dt{background: #980000; padding: 5px;
font-weight: bold; color: white;
width: 115px;}
.sidemenu dd a{color: black;}
.sidemenu dd{padding: 10px;}
.content, .aside{float: right;}
.content{width: 230px; background: #E7E7E7;}
.content dt{background: #002266; padding: 4px; margin: 4px;
font-size: 12px; font-weight: bold;}
.content dt a{color: #E7E7E7; text-decoration: none;}
.content dd{padding: 10px 4px;}
.content dt+dd{font-size: 11px; font-weight: bold;}
.aside{width: 115px; padding: 5px;}
.aside .all{color : #8C8C8C; font-size: 14px;
font-weight: bold; text-decoration: underline;}
.aside .love{color: #FFBB00;font-size: 14px;
font-weight: bold; text-decoration: underline;}
.aside strong{font-size: 14px; font-weight: bold;}
.aside dd{padding: 10px 3px;}
.aside a{color: black; font-weight: bold;}
#footer{clear: both; background: #002266; padding: 5px;}
#footer address{color :white; font-size: 4px;
text-align: center; font-style: normal;}
#footer a{color: white;}
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
<h1>Musée d'Orsay<span><br />Musée d'Orsay Musée d'Orsay
Musée d'Orsay Musée d'Orsay Musée d'Orsay</span>
</h1>
<p class="stit">Royal Academy of Arts, <span>THE REAL VANGOGH
</span> THE ARTIST AND HIS LETTERS</p>
</div>
<div id="container">
<div class="cover">
<div class="content">
<dl>
<dt><a href="#" >피리부는 소년</a></dt>
<dd>에두아르마네</dd>
<dd>1866 캔버스에 유채, 161*97cm, 파리 오르세 Edouard MANET, Le Fifre, H.T, 161*97cm</dd>
</dl>
<dl>
<dt><a href="#">고흐의 방</a></dt>
<dd class="artist">빈센트반고흐</dd>
<dd>1889 캔버스에 유채,57.5*74cm,파리 오르세 Vincent Van GOGH,La Chambre de Van Gogh, H/T, 57.5*74cm </dd>
</dl>
<dl>
<dt><a href="#" >황색 그리스도가 있는 화가의 자화상</a></dt>
<dd class="artist">폴 고갱</dd>
<dd>1890-1891 캔버스에 유채,38*46cm,파리 오르세 Paul Gauguin Portrait de I'artiste au Paul Gauguin, H/T, 38*46cm</dd>
</dl>
<dl>
<dt><a href="#" >오페라좌의 관현악단</a></dt>
<dd class="artist">에드가 드가</dd>
<dd>1868-1869 캔버스에 유채,32*46cm,파리 오르세 Edgar Degas, L'orchestre de I'Opera H/T, 38*46cm</dd>
</dl>
<dl>
<dt><a href="#" >만종</a></dt>
<dd class="artist">장 프랑수아 밀레</dd>
<dd>1857-1859 캔버스에 유채,55.5*66cm,파리 오르세 Jean-Franqois Millet, L'Angelus H/T, 55.5*66cm</dd>
</dl>
<dl>
<dt><a href="#" >제비꽃장식을 단 베르트모리조</a></dt>
<dd class="artist">에두아르마네</dd>
<dd>1872 Eduouard Manet Berthe Morisot au bouquet de H/T, 55*38cm</dd>
</dl>
</div>
<dl class="sidemenu">
<dt>ARTIST</dt>
<dd><a href="#">작가의 작품</a></dd>
<dd><a href="#">작가의 시대</a></dd>
<dd><a href="#">작가의 일생</a></dd>
</dl>
</div>
<dl class="aside">
<dt><span class="all">전세계인들에게</span><span class="love">제일 사랑받는<br/></span><strong>서양미술사의 시대</strong></dt>
<dd><a href="#">Workshop Go<br/></a> <span>Life drowing workshop</span></dd>
<dd><a href="#">Summer exhibition<br/></a> <span>A-level Summer Exibition Online 2010</span></dd>
<dd><a href="#">RA collection<br/></a> <span>RA Collections</span></dd>
</dl>
</div>
<div id="footer">
<address>© 2012 Les Amis du Musée d'Orsay. All rights reserved.
<a href="#">amis@amis-musee-orsay.org</a>
<span>Legal status</span>
</address>
</div>
</div>
</body>
</html>
25. 컴퓨터학과 졸업 / SQLD, 정보처리기사 취득