没有合适的资源?快使用搜索试试~ 我知道了~
web前端-css布局
5星 · 超过95%的资源 需积分: 14 11 下载量 92 浏览量
2013-08-26
17:10:35
上传
评论 2
收藏 347KB PPT 举报
温馨提示
1、固定宽度布局 2、流式布局(自适应式布局) 3、弹性布局 4、栅格化布局 4、可变固定宽度布局 5、混合布局 布局方式的比较。
资源推荐
资源详情
资源评论
1
1
固定宽度布局
固定宽度布局
1.1
1.1
、这种布局有一个设置了固定宽度的外包裹,里面的各
、这种布局有一个设置了固定宽度的外包裹,里面的各
个模块也是固定宽度而非百分比。重要的是容器(外包裹)
个模块也是固定宽度而非百分比。重要的是容器(外包裹)
元素是设置为不能移动的。无论访问者屏幕的分辨率是多少
元素是设置为不能移动的。无论访问者屏幕的分辨率是多少
,网页都显示为和其它访问者相同的宽度。右下图展示的是
,网页都显示为和其它访问者相同的宽度。右下图展示的是
一个固定宽度布局的基本轮廓。里面的三列分别是
一个固定宽度布局的基本轮廓。里面的三列分别是
520
520
,
,
2
2
00
00
和
和
200px
200px
宽度。
宽度。
960px
960px
已经成为现代
已经成为现代
web
web
设计的标准,因为
设计的标准,因为
大多数站点用户被
大多数站点用户被
假定为使用
假定为使用
1024×768
1024×768
分辨率
分辨率
1
1
固定宽度布局
固定宽度布局
许多设计者喜欢固定宽度布局胜过流动布局,因为它更容易
许多设计者喜欢固定宽度布局胜过流动布局,因为它更容易
实现,并确保了设计者所见即用户所见。不过它和流动布局
实现,并确保了设计者所见即用户所见。不过它和流动布局
一样,具有两面性。
一样,具有两面性。
1.2
1.2
、优点
、优点
1
1
、固定宽度布局更容易使用,在设计方面更容易定制。
、固定宽度布局更容易使用,在设计方面更容易定制。
2
2
、在所有浏览器中宽度一样,所以不会受到图片、表单、
、在所有浏览器中宽度一样,所以不会受到图片、表单、
视频和其他固定宽度内容的麻烦。
视频和其他固定宽度内容的麻烦。
3
3
、不需要
、不需要
min-width
min-width
和
和
max-width
max-width
,所有浏览器都支持。
,所有浏览器都支持。
4
4
、即使需要兼容
、即使需要兼容
800×600
800×600
这么小的分辨率,网页的主体内
这么小的分辨率,网页的主体内
容仍然有足够的宽度易于阅读。
容仍然有足够的宽度易于阅读。
1
1
固定宽度布局
固定宽度布局
1.3
1.3
、缺点
、缺点
1
1
、对于使用高分辨率的用户,固定宽度布局会留下很大的
、对于使用高分辨率的用户,固定宽度布局会留下很大的
空白。因此出现了“黄金比例”,“三分定律”,综合平衡和其
空白。因此出现了“黄金比例”,“三分定律”,综合平衡和其
他设计原则。
他设计原则。
2
2
、屏幕分辨率过小时需要垂直滚动条。
、屏幕分辨率过小时需要垂直滚动条。
3
3
、无缝纹理,连续的图案需要适应更大的分辨率。
、无缝纹理,连续的图案需要适应更大的分辨率。
4
4
、固定宽度布局一般在可用性上得分较低。
、固定宽度布局一般在可用性上得分较低。
1.4
1.4
、避开固定宽度设计的弊端
、避开固定宽度设计的弊端
如果你决定使用固定页面设计,你应该知道避开这种布局弊
如果你决定使用固定页面设计,你应该知道避开这种布局弊
端的技巧,创作出成功的设计。
端的技巧,创作出成功的设计。
剩余20页未读,继续阅读
资源评论
- noxLiu2014-05-08把布局讲的很透彻,言简意赅。不错
- kangdandan2017-11-10下载失败了,然后想再下一次,就必须要评论~~
yanglijuan123
- 粉丝: 2
- 资源: 3
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- tomcat6.0配置oracle数据库连接池中文WORD版最新版本
- hibernate连接oracle数据库中文WORD版最新版本
- MyEclipse连接MySQL的方法中文WORD版最新版本
- MyEclipse中配置Hibernate连接Oracle中文WORD版最新版本
- MyEclipseTomcatMySQL的环境搭建中文WORD版3.37MB最新版本
- hggm - 国密算法 SM2 SM3 SM4 SM9 ZUC Python实现完整代码-算法实现资源
- SQLITE操作入门中文WORD版最新版本
- Sqlite操作实例中文WORD版最新版本
- SQLITE特性分析中文WORD版最新版本
- ORACLE创建表空间中文WORD版最新版本
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功