CSS Frames Layouts—–CSS架構

來源:互聯網
上載者:User
文章目錄
  •  
 

New (Dec 26th, 06'): The following are a collection of CSS Frames layouts, where select columns or rows inside the layout remain static even when the page is scrolled, mimicking a frames like behavior.

CSS Left Frame Layout

This is a two columns liquid layout with the left column being static, always in view.

CSS Right Frame Layout

This is a two columns liquid layout with the right column being static, always in view.

CSS Top Frame Layout

This is a two rows liquid layout with the top row being static, always in view.

CSS Bottom Frame Layout

This is a two rows liquid layout with the bottom row being static, always in view.

CSS Left and Right Frames Layout

This is a three columns liquid layout with the leftmost and rightmost columns being static, always in view.

CSS Left and Top Frames Layout

This is a mixed columns and rows layout (two main columns, later split into two rows), with the leftmost column and top row being static, always in view.

CSS Left and Bottom Frames Layout

This is a mixed columns and rows layout (two main columns, later split into two rows), with the leftmost column and bottom row being static, always in view.

CSS Top and Bottom Frames Layout

This is a three rows liquid layout with both the top and bottom rows being static, always in view.

CSS Left, Top and Right Frames Layout

This is a mixed columns and rows layout (three main columns, middle column split into two rows), with everything being static except the bottom row in the middle column.

CSS Left, Bottom and Right Frames Layout

This is a mixed columns and rows layout (three main columns, middle column split into two rows), with everything being static except the top row inside the middle column.CSS Left, Top and Bottom Frames Layout

This is a mixed columns and rows layout (two main columns, later split into three rows), with everything being static except the center row in the right column.

CSS Left, Top, Bottom and Right Frames Layout

This is a mixed columns and rows layout (three main columns, middle column split into three rows), with all of the surrounding columns and rows being static, except the very center container.

 

相關文章

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.