padding

padding：就是內邊距的意思，它是邊框到內容之間的距離

另外padding的區域是有背景顏色的。並且背景顏色和內容的顏色一樣。也就是說background-color這個屬性將填充所有的border以內的區域

padding的設定

padding有四個方向，分別描述4個方向的padding。

描述的方法有兩種

1、寫小屬性,分別設定不同方向的padding

padding-top: 30px;

padding-right: 30px;

padding-bottom: 30px;

padding-left: 30px;

2、寫綜合屬性，用空格隔開

/*上 右 下 左*/
padding: 20px 30px 40px 50px ;

/*上 左右 下*/
padding: 20px 30px 40px;

/* 上下 左右*/
padding: 20px 30px;

/*上下左右*/
padding: 20px;
 

一些標籤預設有padding

比如ul標籤，有預設的padding-left值。

那麼我們一般在做站的時候，是要清除頁面標籤中預設的padding和margin。以便於我們更好的去調整元素的位置。

我們現在初學可以使用萬用字元選擇器

*{
padding:0;
margin:0; 
}

But，這種方法效率不高。

所以我們要使用並集選擇器來選中頁面中應有的標籤（不用背，因為有人已經給咱們寫好了這些清除預設的樣式表，reset.css）

https://meyerweb.com/eric/tools/css/reset/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}