전체보기3 [CSS] postion 종류 [CSS] postion 종류 문서 상에 요소를 배치하는 방법을 지정한다. 1. position: static 요소를 일반적인 문서 흐름에 따라 배치한다. 기준이 없고 좌표적용이 안된다. (top, bottom, right, left, z-index) ONE TWO THREE 2. position: relative 요소를 일반적인 문서 흐름에 따라 배치한다. 자기자신을 기준으로 좌표를 설정한다. ONE TWO THREE 3. position: absolute 가장 가까운 위치 지정 부모 요소에 대해 상대적으로 배치한다. 단, 부모 요소는 static이 아닌 위치가 설정 되어 있어야 한다. (relative, fixed, absolute) 해당 부모 요소가 없으면 body를 기준으로 한다. ONE TWO .. 2023. 9. 20. [CSS] display 종류 [CSS] display 종류 1. display : block 한 행을 전부 차지한다. ex) div, p, h1, li ONE TWO THREE 2. display : inline 가로로 배치가 가능하다. 너비, 높이를 조절할 수 없고, 요소의 내용만큼 차지한다. 너비, 높이를 주고싶으면 로 감싸고 스타일을 준다. ex) span ONE TWO THREE 3. display:inline-block inline 처럼 가로로 배치가 가능하다. block 처럼 너비, 높이를 조절할 수 있다. 태그 사이의 공백 때문에 공간이 생긴다. 공백을 없애기 위해서는 태그 사이에 주석기호를 넣거나 부모의 폰트사이즈를 0으로 한다. ONE TWO THREE 참조 https://codingapple.com/course/h.. 2023. 8. 29. [CSS] 가운데 정렬 하기 [CSS] 가운데 정렬 하기 1. 이미지 가운데 정렬 2. position absolute의 가운데 정렬 3. 억지로 가운데 정렬 (relative 를 가진 부모에 대해 가운데 정렬) 참조 https://codingapple.com/course/html-basics/ 2023. 8. 28. 이전 1 다음