FRONT/CSS2 CSS | Position, 연결 선택자, 속성 선택자 positon static : default, 문서의 흐름에 마줘 배치 realative : 부모요소 absolute : 자식요소 , 상위요소를 기준으로 위치를 지정해 배치 fixed : 브라우저 창을 기준으로 위치를 지정해 배치, 브라우저에서 스크롤 해도 항상 같은 위치 자식요소는 부모요소의 범위 안에서만 움직일 수 있다. 부모자식간의 관계를 맺어주는 속성 연결 선택자 하위 선택자 : 공백 한칸을 두고 씀 section p { } /*상위요소 하위요소*/ 자식 선택자 : '>' 로 구분 section > p { } /*부모 > 자식 */ 인접 형제 선택자 : '+' 다른태그 없이 바로 붙어있는 태그 h1 + p { } /*h1의 형제인 p요소 중 첫번째 p*/ 형제 선택자 : '~' 모든 형제 요소에 .. 2022. 3. 27. CSS | display속성, 여러 속성 display속성 none 말 그대로 보이지 않음. visivility: hidden;을 한 경우 보이지 않을 뿐 영역은 차지하지만 none은 영역도 차지하지 않는다. block 대표적으로 div, p, h, li태그가 해당된다. 가로영역을 모두 채우고 block요소 뒤에 등장하는 태그는 줄바꿈 된것처럼 보이게 된다. width, height를 지정할 수 있다. inline 대표적으로 span, a, br, img 태그가 이에 해당된다. block과 달리 줄 바꿈이 되지 않고 width, height를 지정할 수 없다. inline-block block과 inline의 중간형태이다. 줄바꿈이 되지 않지만 크기는 지정 가능하다. line-height 줄 높이 정하는 속성 ex)폰트 20px일때 line-h.. 2022. 3. 27. 이전 1 다음