상자 모델--테두리

요소와 다른 요소 사이의 거리는 여백을 사용하여 설정할 수 있습니다. 경계는 위쪽, 오른쪽, 아래쪽, 왼쪽으로 나눌 수도 있습니다. 다음 코드:

div{margin:20px 10px 15px 30px;}

를 별도로 작성할 수도 있습니다.

div{
   margin-top:20px;
   margin-right:10px;
   margin-bottom:15px;
   margin-left:30px;
}

위쪽, 오른쪽, 아래쪽 및 왼쪽 테두리가 모두 10px인 경우 다음과 같이 작성할 수 있습니다. >

div{ margin:10px;}

상하 테두리가 10px 같고, 왼쪽과 오른쪽이 20px 같다면 이렇게 쓰면 됩니다.

div{ margin:10px 20px;}

요약하면 패딩과 여백의 차이는, 패딩은 테두리 내부에 있고 여백은 테두리 외부에 있습니다.

아아아아

지속적인 학습

새로운 파일

<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>边距</title> <style type="text/css"> div{ width:300px; height:300px; border:1px solid red; } #box1{margin-bottom:30px;} </style> </head> <body> <div id="box1">box1</div> <div id="box2">box2</div> </body> </html>

제출하다 코드 재설정

자동운전