隨著不斷發(fā)展,CSS3 帶來了許多新的特性和功能,另一元素高度就是其中之一。
CSS3 中的另一元素高度(height for the 'a' element),指的是讓鏈接或者其他行內(nèi)元素?fù)碛懈叨鹊膶傩浴T谝郧暗?CSS 版本中,行內(nèi)元素只能設(shè)置寬度,而高度則是由其內(nèi)部?jī)?nèi)容的大小來決定的。但是當(dāng)需要給鏈接加上背景色或者邊框等樣式時(shí),如果不設(shè)置高度,這些樣式就無法應(yīng)用到鏈接上,從而影響了頁面的美觀。
a { display: inline-block; height: 30px; line-height: 30px; padding: 0 10px; background-color: #f00; color: #fff; }
為了解決這個(gè)問題,CSS3 引入了另一元素高度屬性。通過將鏈接或者其他行內(nèi)元素的 display 屬性設(shè)置為 inline-block,就可以讓其擁有高度和寬度屬性。同時(shí)設(shè)置 line-height 屬性和 height 屬性相等,就可以讓鏈接內(nèi)容垂直居中。這樣就可以方便地添加各種樣式,同時(shí)保持鏈接或行內(nèi)元素的完整性了。
總之,CSS3 中的另一元素高度屬性讓我們可以更靈活地控制行內(nèi)元素的樣式,為我們的頁面設(shè)計(jì)帶來了更多的選擇和可能性。
上一篇css3 反方向播放
下一篇css3 取頁面高度