absolute之整體布局實現,absolute整體布局

來源:互聯網
上載者:User

absolute之整體布局實現,absolute整體布局

  

要實現的布局,我最先想到是將header與footer絕對位置,但是發現在移動端會出現bug,經查資料發現用absolute實現整體布局非常好,還挺簡單的。

.header, .footer, .content {        position: absolute;        left: 0;        right: 0; }.header {     height: 48px;      top: 0;      z-index: 1;     /*other style*/  }.footer {      height: 52px;      bottom: 0;     z-index: 1;      /*other style*/  }.content {      top: 48px;      bottom: 53px;      overflow: auto;     /*other style*/  }

 

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.