N스크린하이브리드앱과정/HTML&CSS

[6주][3일][1~2th] HTML/CSS

광천스러움 2013. 8. 21. 12:47

용어 정리

CSS

z-index: 1; ☜ 상자가 겹칠 때 가장 위에 올 우선순위를 정함

clear:both ☜ 내 양 옆에 아무도 오지마라!

clear:left ☜ 내 왼쪽에 아무도 오지마라!

 

HTML

<article> 본문 내용을 넣을 때 쓰임

<header> 머리말

<navi> 메뉴 부분

<section> 본문

<aside> 본문의 부가설명

<footer> 꼬리 부분

 

 

 

☆ position: relative; 와 absolute의 비교

CSS

section h2{
   font-size: 20px;
   padding-top: 30px;
   position: relative;
   text-shadow: 0px 0px 5px;
  }
  section h3{
   font-size: 12px;
   position: relative;
  }

<section>

html
   <div class="book1">
    <h2>실력이 탐나는 시리즈</h2>
    <h3>전략적 실전 대비 입문서 </h3>
    <p>
     <a href="http://infopub.co.kr" target="_blank" title="정보문화사 사이트로 이동합니다.">&gt;&gt; GO</a>
    </p>
   </div>

 

position: absolute;

 

position: relative; 같은 div 박스 안에서 h2의 상대위치로서, 자동으로 밑으로 내려간다.