dalc3154 님의 블로그

margin: 두 박스 모델 사이의 여백padding: 한 박스 모델에서 테두리와 내용 사이의 여백 margin 속성요소 주변의 여백을 설정>>요소와 요소 사이의 간격을 조절margin:  |  | auto margin 속성너빗값이나 높잇값을 px이나 em 같은 단위와 함께 수치로 지정margin: 50px박스 모델을 포함한 부모 요소를 기준으로 너빗값이나 높잇값을 퍼센트(%)로 지정margin: 0.1%autodisplay 속성에서 지정한 값에 맞게 적절한 값을 자동으로 지정  margin 속성을 사용하여 웹 문서 가운데 정렬>> 배치할 요소의 너빗값 지정좌, 우 마진을 auto로 지정 margin 상쇄위 아래 마진이 서로 만날 경우 마진이 큰 값에 작은 값이 병합되어 사라짐주의) 좌우 마진이 만날경우..

박스 모델의 방향박스 모델은 테두리나 마진, 패딩 등을 지정할 때 상하좌우 4개의 여백을 똑같이 지정하거나, 모두 다르게 지정 가능상>우>하>좌 순으로 지정 border-style 속성테두리 스타일 지정>>기본값 none>>속성값을 지정하지 않으면 테두리 관련 속성을 지정하더라도 화면에 표시되지 않음 border-style 속성값none테두리 : 기본값hidden테두리 감추기 표에서 border-collapse: collapse일 경우 다른 테두리도 표시​solid테두리를 실선으로 표시dotted테두리를 점선으로 표시dashed테두리를 짧은 직선으로 표시double테두리를 이중선으로 표시, border-width값 : 두 선 사이의 간격groove테두리를 창에 조각한 것처럼 표시, 홈이 파인 듯한 입체 ..

박스 모델이란? 웹 문서에서 내용 배치 시>> 각 요소를 박스 형태로 구성각 박스 모델은 실제 내용이 들어가는 콘텐츠 영역과 테두리, 여백으로 구성 블록 레벨 요소 & 인라인 레벨 요소블록 레벨 요소태그를 사용해 요소 삽입 시 혼자 한 줄을 차지하는 것 >> 해당 요소의 너비가 100%블록 레벨 요소의 왼쪽이나 오른쪽에 다른 요소가 올 수 없음 인라인 레벨 요소태그를 사용해 요소 삽입 시 해당 콘텐츠만큼만 영역을 차지>>나머지 공간에 다른 요소 삽입 가능한 줄에 여러 개의 인라인 레벨 요소 삽입 가능 박스 모델의 기본 구성콘텐츠 영역패딩: 박스와 콘텐츠 영역 사이의 여백테두리: 박스의 테두리마진: 여러 박스 모델 사이의 여백 width, height 속성콘텐츠 영역의 크기 지정너비나 높이의 값을 px O..

속성(properties): 스타일을 적용할 대상의 특성>> 변경하고자 하는 스타일의 종류를 지정>> 속성은  CSS  규칙 내에서 선언되며, 콜론 뒤에 해당 속성에 적용할 값을 지정 값(values): 속성에 할당되어, 그 속성이 어떻게 적용될지를 구체적으로 명시>> 속성이 실제로 어떤 스타일을 나타낼지를 결정>> 값은 속성 다음에 오며, 세미콜론으로 구문을 종료하기 전에 속성 값으로 지정 CSS 값(데이터 유형)>> CSS에서 특정 속성에 유효한 데이터를 지정하는 것 길이와 거리절대 길이 단위>>px(픽셀): 가장 일반적으로 사용되는 절대 길이 단위 상대 길이 단위>>rem, em: 루트 요소의 글꼴 크기 / 요소의 글꼴 크기>>vw, vh: 뷰포트의 너비, 높이의 백분율로 나타내는 단위백분율>>부모..