CSS의 Margin 속성
하는 CSS margin 속성은 요소의 주위에 공간을 생성하는 데 사용됩니다.
margin 속성은 테두리 바깥 공백의 크기를 설정합니다.
이 요소는이 margin 픽셀 범위의합니다.
CSS의 Margins
하는 CSS margin 속성은 테두리 바깥 공백의 크기를 설정합니다.
 | : 주 margins 완전히 투명 -과 배경 색상을 가질 수 없습니다! |
|---|
CSS를 사용하면 완벽하게 제어 할 수있는 margins . 설정에 CSS의 호텔을 고를 수 있습니다 margin 요소 (왼쪽 상단, 오른쪽, 하단 등)의 각 측면에 대한이.
Margin - 개별 매칭
CSS는 지정하는 속성이 margin 요소의 각 측면에 대해를 :
-
margin-top -
margin-right -
margin-bottom -
margin-left
모든 margin 속성은 다음의 값을 지정할 수 있습니다 :
- auto - 브라우저가 계산 margin
- 길이 - 한 지정 margin 의 px, pt, cm 등
- % - 한 지정 margin 포함하는 요소의 폭 %의
- 상속 일 - 지정합니다 margin 부모 요소로부터 상속되어야한다
| 주 : 마이너스 값을 사용하는 것도 가능하다 margins ;콘텐츠를 중복합니다. |
|---|
다음의 예는 다른 설정 margins (A)의 네면에 대한 <p> 요소를 :
다음의 예는 왼쪽 있습니다 margin 부모 요소에서 상속 할 수 :
예
div.container {
border: 1px solid red;
margin-left: 100px;
}
p.one {
margin-left:
inherit;
} »그것을 자신을 시도 Margin - 약식 속성
코드를 단축하기 위해, 모든 지정할 수 있습니다 margin 하나의 속성에 속성을.
margin 속성은 다음과 개인에 대한 약식 속성이다 margin 속성 :
-
margin-top -
margin-right -
margin-bottom -
margin-left
어떻게 작동하는지 그래서, 여기입니다 :
경우 margin 속성은 네 개의 값이 있습니다 :
- margin : 25 픽셀 50 픽셀 75px 100 픽셀;
- 상단 여백은 25 픽셀입니다
- 오른쪽 여백은 50 픽셀입니다
- 아래쪽 여백이 75px입니다
- 왼쪽 여백은 100 픽셀입니다
경우 margin 속성은 세 가지 값이 있습니다 :
- margin : 25 픽셀 50 픽셀 75px;
- 상단 여백은 25 픽셀입니다
- 오른쪽과 왼쪽 여백이 50 픽셀입니다
- 아래쪽 여백이 75px입니다
경우 margin 속성은 두 개의 값이 있습니다 :
- margin : 25 픽셀 50 픽셀;
- 상단과 하단 여백이 25 픽셀입니다
- 오른쪽과 왼쪽 여백이 50 픽셀입니다
경우 margin 속성은 하나의 값을 갖는다 :
- margin : 25 픽셀;
- 네 마진은 25 픽셀입니다
자동 값의 사용
당신은 설정할 수 있습니다 margin 에 속성을 auto 수평 컨테이너 내의 요소를 중심에.
요소는 특정 폭을 차지하며, 나머지 공간은 좌측 및 우측 사이에서 동등하게 분할한다 margins :
연습으로 자신을 테스트!
모든 CSS 여백 속성
| 재산 | 기술 |
|---|---|
| margin | 상기 설정하는 약식 속성 margin 하나의 선언에서 속성을 |
| margin-bottom | 아래 설정 margin 요소의를 |
| margin-left | 왼쪽 설정 margin 요소의를 |
| margin-right | 오른쪽 설정 margin 요소의를 |
| margin-top | 가기 설정 margin 요소의를 |