DIV+CSS各种布局实例(附下载)
2009-03-30 13:02
696 查看
Two Column Flexible
Browsers:'
'
'
'
(5+)
Description: Probably the easiest page to make. Contains two layout divs, the main content div is just floated to the left. Very simple!
Actions: View | Image Preview | Download [ 5k] [ZIP]
Two Column Flexible With Header
Browsers:'
'
'
'
(5+)
Description: Basically the same template as above but with the addition of a header div for page title, your logo or banners etc. Again very simple to set up.
Actions: View | Image Preview | Download [ 3k] [ZIP]
Two Column, Left Column Static
Browsers:'
'
'
'
(5+)
Description: Two columns, the left column is absolutely positioned on the left and is a fixed width. The right content column is sized and positioned by using margins and will resize with the browser window.
Actions: View | Image Preview | Download [ 6k] [ZIP]
Two Column, Left Column Static, with Header Bar
Browsers:'
'
'
'
(5+)
Description: This is the same template as above but with the addition of a simple header bar which can be used for links, search box etc..
Actions: View | Image Preview | Download [ 6k] [ZIP]
Two Column Fixed Width with Header & Footer
Browsers:'
'
'
'
(5+)
Description: A fixed width centered page with a header, footer, left navigation column and right content column. One of my favourites.
Actions: View | Image Preview | Download [ 6k] [ZIP]
Three Column, Left & Right Columns Static
Browsers:'
'
'
'
(5+)
Description: This is much the same as 'Two Col Left Col Static' but now with the addition of a right hand column which is absolutely positioned.
Actions: View | Image Preview | Download [ 6k] [ZIP]
Three Column 'Pixel-Perfect'
Browsers:'
'
'
'
(6)
Description: Sometimes this is called the "Holy Grail". It's a three column template which fits together "pixel perfect".
Actions: View | Image Preview | Download [ 6k] [ZIP]
Three Column 'Pixel-Perfect' with Header
Browsers:'
'
'
'
(6)
Description: The same as the "Holy Grail" above but with a header div. Also expands to fit the whole screen.
Actions: View | Image Preview | Download [ 3k] [ZIP]
Three Column Pixel-Perfect with Header & Footer
Browsers:'
'
'
'
(5+)
Description: My most complete template. It has three columns, a header and footer and will resize with the browser window.
Actions: View | Image Preview | Download [ 6k] [ZIP]
相关文章推荐
- 收藏网站制作常用经典css.div.布局.设计实例打包下载(下方有其他链接)
- 收藏网站制作常用经典css.div.布局.设计实例打包下载
- 收藏网站制作常用经典css.div.布局.设计实例打包下载2
- 收藏网站制作常用经典css.div.布局.设计实例打包下载2
- 收藏网站制作常用经典css.div.布局.设计实例打包下载1
- 十天学会DIV+CSS第十天 div+css网页标准布局实例教程
- DIV+CSS布局网页的一个实例
- 43个实例xHTML+CSS(DIV+CSS)网页及导航布局教程
- div+css布局实例淘宝分析(一)
- div+css布局实例
- <div+css页面布局课堂笔记>10---页面布局网站首页设计实例__2
- 43个实例xHTML+CSS(DIV+CSS)网页及导航布局教程
- 43个实例xHTML+CSS(DIV+CSS)网页及导航布局教程
- CSS网页布局DIV水平居中的各种方法
- DIV+CSS网页另类上下布局的实例代码
- [转]CSS网页布局:div水平居中的各种方法
- 简洁 DIV+CSS布局入门之一 ( DIV+CSS常用 常用CSS DIV+CSS实例 简单DIV+CSS DIV+CSS布局分析 DIV+CSS流程)
- DIV+CSS 三栏布局实例代码
- CSS+DIV常用基本网页布局实例
- CSS弹出二级多列菜单和DIV布局实例 - 仿IBM官网首页