HTML+CSS 輕鬆入門之盒子模型之填充
元素內(nèi)容與邊框之間是可以設(shè)定距離的,稱為「填滿」。填充也可分為上、右、下、左(順時(shí)針)
下面我們寫一個(gè)實(shí)例:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> div{ width:200px; height:100px; border:1px solid red; padding:10px 10px 10px 10px; } </style> </head> <body> <div>php中文網(wǎng)</div> </body> </html>
其實(shí)也可以這麼寫
div{ padding-top:10px; padding-right:10px; padding-buttom:10px; padding-left:10px; }
如果都是同樣也可以這樣寫
padding:10px;
順序是上?右?下?左?
如果上下值相同,左右值相同,可以這樣寫
padding:10px 20px;