響應(yīng)式網(wǎng)頁設(shè)計(jì)基礎(chǔ)也是重點(diǎn)：靈活性(5)

　　#push li a { padding-left: 27.7777777%; /* 25px / 90px */ }

　　縱向值

　　到目前為止，我們已經(jīng)嚴(yán)謹(jǐn)?shù)赜?jì)算了左右的水平值，但是我們?cè)趚軸和y軸方向都會(huì)設(shè)定padding和margin，這就意味著，上下文寬度應(yīng)該依據(jù)水平或垂直方向而變化。

　　正如你之前看到的那計(jì)算，水平方向的百分比值，都是以父元素的寬度作為上下文寬度的(padding是除外)。與此同時(shí)，縱向em值是以基本字體大小作為上下文值的。

　　如果你還記得成比例的字號(hào)的計(jì)算那一部分內(nèi)容，我們?yōu)镋E-podcast.com設(shè)定的基本字體大小是16px. 所以，如果我想指定縱向的margin和padding，上下文高度值就是16px. 此外，縱向值應(yīng)該用em表示，不是百分比 和成比例的字號(hào)的單位一樣。

　　這個(gè)網(wǎng)站的和都有縱向的padding：有20px的頂部padding，有20px的底部padding。(見圖4)

　　要確定這些padding比例值，我將16px作為上下文高度值(也就是基本字體的大小)，并使用相同的公式進(jìn)行計(jì)算： 20 ÷ 16 = 1.25

　　請(qǐng)記住，垂直方向上的比例值應(yīng)該以em為單位。也就是說可以在CSS中直接使用浮點(diǎn)值，不用轉(zhuǎn)換成百分比：

　　header,footer, .wrap{ padding:1.25em 4.25531%;/*TB-20px/16px|RL-40px/940px*/ width:79.3%; }

　　這里，我將橫向和縱向的padding值都簡寫了，修改了一些注釋的內(nèi)容，以便為今后的開發(fā)提供能多參考。

　　padding:1.25em 4.25531%;/*TB-20px/16px|RL-40px/940px*/

　　在這些注釋中，我將頂部和底部的值都用TB- 前綴進(jìn)行標(biāo)識(shí)，左右的值用RL-前綴。這僅僅試是幫我記錄這些比例值是如何計(jì)算的。你同樣可以使用自己熟悉的格式或者語法，強(qiáng)烈建議你花些時(shí)間去記錄他們。

　　成比例的高度

　　在開發(fā)當(dāng)中，我通常不會(huì)指定高度值。但是在EE Podcast網(wǎng)站中需要做很多高度的設(shè)定，比如，的高度設(shè)定為148像素