2010年4月14日星期三

CSS垂直置中

 

在表格(Table)中的vertical-align

 

在表格裡使用vertical-align的結果是最容易被理解的,就是把表格欄的內容垂直放在欄中,這就是很久以前HTML裡的valign=middle”(退休了的標準,不要用了﹗)

 

利用line-height

 

先把Container設定固定高度,再把有關的元件line-height設定到有關的高度。

 

       #ContainerA {

              height: 80px;

              background-color: #CCCCCC;

              border: solid 1px #000000;

              padding: 0;

              margin: 0;

       }

       #ContainerA p {

              line-height: 80px;

              margin: 0;

              padding: 0;

       }

 

想找好的CSS網頁設計公司?找AVEEGO吧﹗

 

Container沒有固定高度?乾脆設定padding就可以了﹗

 

       #ContainerB {

              background-color: #CCCCCC;

              border: solid 1px #000000;

              padding: 30px 10px;

              margin: 0;

       }

       #ContainerB p {

              margin: 0;

              padding: 0;

       }

 

有關的垂直置中效果可參看如何利用CSS做到『垂直置中』?

Posted via web from designer173's posterous

没有评论: