1103_css_position

<Position>

태그의 위치를 정의

 

특징

         1. 부모요소는 반드시 position relateive해야한다

         2. 그 자식은 position absolute 해야한다 

 

<값>

• static (기본값)
• absolute (브라우저 상단 0,0 고정값)
• relative (position 주기 전 위치기준, 상대위치)
• fixed
• inherit
•  

<이동 속성>

• left
• right
• top
• bottom

 

- 사용 예시)

        .wrap{
            position: absolute;
            width: 50px;
            height: 50px;
            background-color: yellowgreen;
        }

        #card1{
            top:0;
            left:0;
        }

<div class="wrap">
        <div class="box" id="card1"></div>
        <div class="box" id="card2"></div>
        <div class="box" id="card3"></div>
        <div class="box" id="card4"></div>
        <div class="box" id="card5"></div>
    </div>