> 웹 프론트엔드 > 프런트엔드 Q&A > HTML에서 마진은 무엇을 의미합니까?

HTML에서 마진은 무엇을 의미합니까?

青灯夜游
풀어 주다: 2023-02-17 14:17:06
원래의
38394명이 탐색했습니다.

HTML에서 여백은 요소 테두리 주변의 빈 영역을 의미하는 "여백"을 의미합니다. 여백을 설정하면 요소 외부에 추가 "빈 공간"이 생성되어 상자 사이에 "거리"가 남게 됩니다. 여백을 설정하려면 길이 단위, 백분율 값 또는 음수 값까지 허용하는 CSS 여백 속성을 사용해야 합니다.

HTML에서 마진은 무엇을 의미합니까?

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

HTML에서 여백은 "여백"을 의미하며 요소 테두리를 둘러싸는 빈 영역을 나타냅니다.

여백을 설정하면 요소 외부에 추가 "공백"이 생성되어 상자 사이에 "공백" 거리가 제공됩니다.

여백을 설정하는 가장 쉬운 방법은 길이 단위, 백분율 값 또는 음수 값까지 허용하는 여백 속성을 사용하는 것입니다.

margin 속성은 픽셀, 인치, 밀리미터 또는 em 등 모든 길이 단위를 허용합니다.

여백은 자동으로 설정할 수 있습니다. 보다 일반적인 접근 방식은 여백의 길이 값을 설정하는 것입니다. 다음 선언은 h1 요소의 각 측면에 1/4인치 너비의 여백을 설정합니다.

h1 {margin : 0.25in;}
로그인 후 복사

다음 예에서는 h1 요소의 네 측면에 대해 서로 다른 여백을 정의합니다. 사용되는 길이 단위는 픽셀(px)입니다.

h1 {margin : 10px 0px 15px 5px;}
로그인 후 복사

이 값의 순서는 위쪽 여백(상단)에서 시작하여 요소를 중심으로 시계 방향으로 회전합니다.

margin: top right bottom left
로그인 후 복사

또한 여백에 대한 백분율 값을 설정할 수도 있습니다.

p {margin : 10%;}
로그인 후 복사

백분율은 상위 요소의 너비를 기준으로 계산됩니다. 위의 예에서는 p 요소의 여백을 상위 요소 너비의 10%로 설정합니다.

여백의 기본값은 0이므로, 여백 값을 선언하지 않으면 여백이 나타나지 않습니다. 그러나 실제로 브라우저는 이미 많은 요소에 대해 미리 결정된 스타일을 제공하고 있으며 여백도 예외는 아닙니다. 예를 들어 CSS를 지원하는 브라우저에서 여백은 각 단락 요소 위와 아래에 "빈 줄"을 만듭니다. 따라서 p 요소에 여백이 선언되지 않은 경우 브라우저는 자체적으로 여백을 적용할 수 있습니다. 물론, 구체적으로 선언하는 한 기본 스타일은 재정의됩니다.

추천 튜토리얼: "html 비디오 튜토리얼", "CSS 비디오 튜토리얼"

위 내용은 HTML에서 마진은 무엇을 의미합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿