marginçå®ä¹åç¨æ³ï¼
è¿ä¸ªç®åå±æ§è®¾ç½®ä¸ä¸ªå
ç´ ææå¤è¾¹è·ç宽度ï¼æè
设置åè¾¹
ä¸å¤è¾¹è·ç宽度ã
å级å
ç´ çåç´ç¸é»å¤è¾¹è·ä¼å并ï¼èè¡å
å
ç´ å®é
ä¸ä¸å ä¸ä¸å¤è¾¹è·ãè¡å
å
ç´ ççå·¦å³å¤è¾¹è·ä¸ä¼å并ãåæ ·å°ï¼æµ®å¨å
ç´ çå¤è¾¹è·ä¹ä¸ä¼å并ãå
许æå®è´çå¤è¾¹è·å¼ï¼ä¸è¿ä½¿ç¨æ¶è¦å°å¿ã
ä¾å¦ï¼è®¾ç½® p å
ç´ ç 4 个å¤è¾¹è·ï¼
p
{
margin:2cm 4cm 3cm 4cm;
}
ä¾1ï¼
margin:10px 5px 15px 20px;
ä¸å¤è¾¹è·æ¯ 10px
å³å¤è¾¹è·æ¯ 5px
ä¸å¤è¾¹è·æ¯ 15px
å·¦å¤è¾¹è·æ¯ 20px
ä¾2ï¼
margin:10px 5px 15px;
ä¸å¤è¾¹è·æ¯ 10px
å³å¤è¾¹è·åå·¦å¤è¾¹è·æ¯ 5px
ä¸å¤è¾¹è·æ¯ 15px
ä¾3ï¼
margin:10px 5px;
ä¸å¤è¾¹è·åä¸å¤è¾¹è·æ¯ 10px
å³å¤è¾¹è·åå·¦å¤è¾¹è·æ¯ 5px
paddingçå®ä¹åç¨æ³ï¼
padding å±æ§è®¾ç½®å
ç´ çå
è¾¹è·ã
padding å±æ§å®ä¹å
ç´ è¾¹æ¡ä¸å
ç´ å
容ä¹é´ç空é´ã
该å±æ§å¯éå 4 个å¼ï¼
å¦æè§å®ä¸ä¸ªå¼ï¼æ¯å¦ div {padding: 50px} - ææå个边ç padding é½æ¯ 50 pxã
å¦æè§å®ä¸¤ä¸ªå¼ï¼æ¯å¦ div {padding: 50px 10px} - ä¸ä¸å
è¾¹è·æ¯ 50 pxï¼å·¦å³å
è¾¹è·æ¯ 10 pxã
å¦æè§å®ä¸ä¸ªå¼ï¼æ¯å¦ div {padding: 50px 10px 20px} - ä¸å
è¾¹è·æ¯ 50 pxï¼å·¦å³å
è¾¹è·æ¯ 10 pxï¼ä¸å
è¾¹è·æ¯ 20 pxã
å¦æè§å®å个å¼ï¼æ¯å¦ div {padding: 50px 10px 20px 30px} - ä¸å
è¾¹è·æ¯ 50 pxï¼å³å
è¾¹è·æ¯ 10 pxï¼ä¸å
è¾¹è·æ¯ 20 pxï¼å·¦å
è¾¹è·æ¯ 30 pxã