먼저 margin이 무엇을 의미하는지 알아야 합니다. 여백 속성은 하나의 명령문에서 모든 여백 속성을 설정하는 CSS의 약칭 속성입니다. 각 요소 사이의 거리를 제어하는 데 사용되는 속성입니다. 그들은 투명하고 보이지 않습니다.
margin 속성에는 왼쪽 여백: 왼쪽 요소 블록으로부터의 거리(왼쪽 내부 여백 로부터의 거리 설정), 여백 상단: 상단(상단) 요소 블록으로부터의 거리(상단 요소 블록으로부터의 거리 설정); margin right: 오른쪽으로부터의 거리 요소 블록 거리(오른쪽 요소 블록으로부터의 거리 설정), margin bottom: 아래쪽 요소 블록 거리(하위(아래) 요소 블록으로부터의 거리 설정) 2차원 구성 다이어그램은 CSS 속성 2차원 다이어그램에서 볼 수 있습니다.
왼쪽 여백 사용법: margin-left:10px; 이는 왼쪽 요소 블록에서 10픽셀을 의미하며, 그 뒤에 (margin-left:10%; 왼쪽 요소 블록에서 10% 거리)와 같은 백분율이 올 수 있습니다. CSS margin-left 튜토리얼 ;
margin right 사용법: margin-right:10px; 이는 오른쪽 요소 블록에서 10픽셀을 의미하며 그 뒤에는 (margin-right:10%; 10% distance)
margin top 사용법: margin-top:10px; 이는 상단 요소 블록에서 10픽셀을 의미하며 그 뒤에는 (margin-top:10%; 10%) 상단 요소 블록으로부터의 거리) CSS margin-top;
margin 하단 사용법: margin-bottom:10px; 이는 하단 요소 블록으로부터 10픽셀을 의미하며, 그 뒤에는 (margin-bottom: 10%; 하단 요소 블록으로부터의 거리 10%) CSS margin-bottom ;
마진 중간에 있는 "-" 링크에 주의하세요. 거리 값을 설정할 때 ":"를 사용하여 값을 지정하세요. ";"로 끝나며, 모두 소문자 반각을 사용합니다.
왼쪽과 오른쪽 모두에 여백 값을 설정해야 하는 경우 CSS를 최적화하기 위해 약어로 구현할 수 있습니다.
예를 들어 약어는
margin:10px입니다. 이는 상단, 하단, 왼쪽 및 오른쪽 요소 블록 사이의 거리가 10픽셀(10픽셀)임을 의미하며 이는 margin-top:10px와 같습니다. 하단:10px; margin-right:10px ; 동일한 효과의 약어
margin:5px 10px; 상단 요소 블록과 하단 요소 블록 사이의 거리가 5px임을 의미합니다. 오른쪽 요소 블록은 10px이며, 이는 margin-top:5px; margin-left:10px; margin-right:10px; 위쪽 요소 블록 사이의 거리는 5px이고 아래쪽 요소 블록 사이의 거리는 7PX이며 왼쪽과 오른쪽 요소 블록 사이의 거리는 6px이며 이는 margin-top:5px와 같습니다. margin - left:6px; margin-right:6px; 동일한 효과의 약어
margin:5px 6px 7px 8px; 즉, 위쪽 요소 블록 거리는 5px, 아래쪽 요소 블록 거리는 7px입니다. 왼쪽 요소 블록 거리는 margin-top:5px; margin-right:7px; margin-right:8px와 동일합니다.
CSS의 여백 속성이 필요한 친구는 이를 저장할 수 있습니다. 이 사이트의 다른 업데이트에도 계속 관심을 가져주세요.
관련 자료:
다양한 기본 그래픽 그리기를 위한 CSS3 팁 HTML 및 CSS 제작 QQ 펭귄 튜토리얼위 내용은 CSS 마진은 무엇을 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!