>웹 프론트엔드 >CSS 튜토리얼 >CSS 외부 여백 사용에 대한 자세한 설명

CSS 외부 여백 사용에 대한 자세한 설명

高洛峰
高洛峰원래의
2017-03-16 11:06:171625검색

이 글에서는 CSS 여백 사용에 대해 자세히 설명합니다

h2{margin:10px 0;}
p{margin:20px 0;}
......<h2>这是一个标题</h2><p>
    <h2>这是又一个标题</h2></p>本例中,第一个h2的margin-bottom(10px),p的margin-top(20px),第二个h2的margin-top(10px)将被合并,它们之间的margin间隙最后是(20px),即取三者之间最大的那个值。


구문:

margin: [ 68a5e25fa594d1d5e743508c418dbff1 여백 계열: 길이 값을 사용하여 외부 패딩을 정의합니다. 음수일 수 있음

  • 42c97a047d75abc12b9b351eb8562711: 백분율을 사용하여 외부 패딩을 정의합니다. 가로(기본) 쓰기 모드에서는 계산을 위해 해당 포함 블록
  • width

    를 참조하세요. 다른 경우에는 음수가 될 수 있는 height를 참조하세요.

  • 설명:

    객체 네 변의 확장 여백을 검색하거나 설정합니다.

      4가지 매개변수 값을 모두 제공하면 상, 우, 하, 좌 순으로 4면에 적용됩니다.
    • 1개만 제공되면 4개 면 모두 사용됩니다.
    • 두 개가 제공되는 경우 첫 번째는 상하용, 두 번째는 왼쪽 및 오른쪽용입니다.
    • 3개가 제공되면 첫 번째는 위쪽용, 두 번째는 왼쪽 및 오른쪽용, 세 번째는 아래쪽용입니다.
    • 대체되지 않은 인라인 요소는 이 속성을 사용하여 왼쪽과 오른쪽에 외부 패치를 설정할 수 있습니다. 위쪽과 아래쪽에 외부 패치를 설정하려면 다음을 수행해야 합니다. 먼저 개체가 블록 수준 또는 인라인 블록 수준으로 표시되도록 만듭니다.
    • 확장 여백은 항상 투명합니다.
    • 일부 인접한 여백이 병합되며 이를 여백 접기라고 합니다.

      h2{margin:10px 0;}
      p{margin:20px 0;}
      ......<h2>这是一个标题</h2><p>
          <h2>这是又一个标题</h2></p>本例中,第一个h2的margin-bottom(10px),p的margin-top(20px),第二个h2的margin-top(10px)将被合并,它们之间的margin间隙最后是(20px),即取三者之间最大的那个值。


    상위 요소는 첫 번째/마지막 하위 요소 및 여백과 병합됩니다

    위 내용은 CSS 외부 여백 사용에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

    성명:
    본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.