absolute - govl2233/project_studyej GitHub Wiki

텍스트 위치는 없어서 위에 적혀있음.(적출)

위치4개를 다 0으로 화면 화면에꽉차있음

%는 화면상의 %이다. 화면을 줄여도 늘려도 좌표값크기 유지(반응형)

4.코드상 마지막이 덮는다. 그래서 x-index(포지션이 선언되어있어야 사용가능)인덱스 주면 덮는순서를 바꿀수있다.(값이높으면높을수록) but 그룹된(부모요소)가 있으면 자식(개인)으로 인덱스 값을9999를 줘도 안먹힘.

부모만드는법: 
나보다 가까운 부모되는 엘리먼트에 포지션만 선언되어있으면됨
-값px 쓰면 현재위치로부터 밖으로 나갈수 있음.
relative,absolute 아무거나 포지션 잡아도 부모가될수있음.

★overflow:hidden는 부모요소한테만 먹혀서 자식요소가 부모요소 밖으로못나감(자식요소가안보여짐)

ex)

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>부모자식관계</title>
    <style type="text/css">
        .wrapper{width: 600px; height: 600px; border:1px #f0f solid; position:absolute; overflow:hidden;}
        .wrap{width: 500px; height: 500px; border:1px #f00 solid;}
        .box{width: 220px; height: 220px; border:1px #f00 solid; position:absolute; left:500px;}
        /*overflow:hidden을 주면 자식요소는 부모요소안에만큼은 보여지기때문에 left로 부모를 넘어가면 잘리는것처럼보인다.*/
   
    </style>
</head>
<body>
    <div class="wrapper">
        <div class="wrap">
            <div class="box"></div>
        </div>
    </div>
</body>
</html>

absolute - govl2233/project_studyej GitHub Wiki

⚠️ **GitHub.com Fallback** ⚠️

⚠️ GitHub.com Fallback ⚠️