div 안에 콘텐츠를 배치하는 방법은 무엇입니까?

Question

내가 먼저 위치를 설정해야합니다 블로그 문서 미리보기를 만들기 위해 노력하고 문서의 헤더

#Parent { 
width: 500px; 
height: 500px; 
background-color: grey; 
} 
#Child { 
color: white; 
position: ?; 
top ?; 
padding ?; 
} 

Answer 1

부모 DIV의 내부에 자식 DIV의 위치를 ​​사업부의 상단에 0 픽셀을 가지고 싶어 상위 div의 position : relative. 그런 다음 child div를 position : absolute로 설정합니다. 그런 다음 위쪽/왼쪽/오른쪽/아래쪽을 사용하여 부모 div에 따라 하위 div를 배치 할 수 있습니다. 규칙은 기본적으로 요소에 position : absolute를 사용하면 페이지 흐름에서 벗어나 가장 가까운 위치 요소에 따라 '절대적으로'배치됩니다.

#Parent { 
width: 500px; 
height: 500px; 
background-color: grey; 
position: relative; /* new code here */ 
} 
#Child { 
color: white; 
position: absolute; 
top: 0; 
padding: 10px; 
}