일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- 럭키스타
- 갤럭시S
- 매드무비
- 영상편집
- ハレ晴レユカイ
- 할인반환금제도
- 트릭스터
- 코이즈미 이츠키
- 마도학자
- 맑고맑게유쾌하게
- 스즈미야 하루히의 우울
- 로고
- 위약금제도3
- not supported
- ED
- 아이돌링
- 어둠의전설
- SKT 불매
- 하루히댄스
- Galaxy S
- 럭키☆스타
- 던전앤파이터
- 던파
- 전면스킨
- 스킨다부치
- 디자인론
- 위약3
- 맑게맑게유쾌하게
- Premiere Pro
- 리리카SOS
- Today
- Total
IAress
웹표준과 접근성 7일차. 본문
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko" lang="ko">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<style type="text/css">
/* reset */
h1, h2, p, div, {
margin: 0px;
padding: 0px;
}
body{
font-family: "돋움",dotum, arial;
font-size: 12px;
font-weight: normal;
}
/* 디자인에 필요없는 요소 감추기 */
{
display: /* show, block, inline */
}
#mainTitle { display: none; }
/* GNB */
#gnb {
width: 800px; /* width: 100%;*/
margin: auto;
position: relative;
}
#m1, #m2, #m3, #m4, #m5 {
background: #3399ff;
width: 160px; /* width: 20% */
float: left; /* left:160px->left: 20% */
font-size: 0.8em; /* 80% */
text-align: center;
color: #fff;
/*height: 30px;*/
/*padding: 10px 0;*/
line-height: 30px;
}
#s1, #s2, #s3, #s4, #s5 {
position: absolute;
top: 100px;
}
.clear { clear:both }
</style>
</head>
<body>
<div id="main">
<div id="header">
<div id="logo">
<h1 id="mainTitle">삼성전자</h1>
</div>
<div id="gnb">
<div id="m1"><h2>제품정보</h2></div>
<div id="s1">
<ul>
<li>휴대폰</li>
<li>TV/AV</li>
<li>IT</li>
<li>IT모바일</li>
</ul>
</div>
<div id="m2"><h2>비즈니스</h2></div>
<div id="s2">
<ul>
<li>사업소개</li>
<li>비전안내</li>
<li>제휴문의</li>
</ul>
</div>
<div id="m3"><h2>고객지원</h2></div>
<div id="s3">
<ul>
<li>메뉴얼 다운로드</li>
<li>제품보증기간</li>
<li>매장 찾기</li>
</ul>
</div>
<div id="m4"><h2>제품리뷰</h2></div>
<div id="s4">
<ul>
<li>생활가전</li>
<li>IT/모바일</li>
<li>컴퓨터/노트북</li>
</ul>
</div>
<div id="m5"><h2>삼성Apps</h2></div>
<div id="s5">
<ul>
<li>Apps 특징</li>
<li>Apps 소개</li>
<li>다운로드</li>
</ul>
<div class="clear"></div>
</div>
</div>
</div>
</div>
<br />
<br />
<br />
<br />
</body>
</html>