CSS 학습 (8) 박스 모델

상자를 상자 각 요소는 페이지 (박스)의 직사각형 영역을 생성

상자 유형 :

1. 행 상자 , 디스플레이 속성 = 인라인 요소는 포장하지 않습니다 (기본값)

2. 카세트 블록 , 표시 속성 = 블록 요소 랩

브라우저의 기본 스타일 시트 카세트 블록 : 컨테이너 요소, H1 ~ H6, P

공통 줄 상자 : 스팬, A, IMG, 비디오, 오디오

상자의 일부

광고 카트리지 또는 블록 카세트 여부 그들이 내측에서 외측으로 다음의 네 부분을 갖는다 :

컨텐츠 영역의 컨텐츠를 ①

박스 내용 : 내용 상자

폭 높이

지역 패딩을 채우기 ②

채워진 카세트 : 패딩 박스 (지역 채워진 + 내용 지역)

패딩 패딩 왼쪽 오른쪽 패딩 탑 바닥 패딩 속기 패딩 : 오른쪽 하부 좌측 (시계 방향)

③ 국경 경계

하우징의 국경 : 국경 박스 (콘텐츠 영역 + + 채워진 영역의 경계)

테두리 스타일 테두리 폭 국경 스타일 테두리 폭 (짧은) 테두리 색 테두리 색 (짧은)

보더 상부 폭 보더 오른쪽 폭 테두리 바닥 폭 보더 왼쪽 폭  

④ 여백 여백

다른 상자에 국경에서의 거리

마진 탑 마진 오른쪽 여백 하단 여백 왼쪽

속기 마진

추천

출처www.cnblogs.com/1016391912pm/p/11564321.html