精通CSS高级Web标准解决方案(7、布局)
2024-10-21 02:56:45
7.1 让设计居中
7.1.1 使用自动空白边让设计居中
<body>
<div id="wrapper">
</div>
</body>
body{ text-align:center;
min-width:760px; } #wrapper{
width:700px;
margin:0 auto; }
7.1.1 使用定位和负值空白边让设计居中
#wrapper{
width:700px;
positon:relative;
left:50%;
margin-left:-350px; }
7.2 基于浮动的布局
浮动几乎所有元素,在文档的“战略点”(如 footer)进行清理浮动。
主要内容放在文档的上面,在加载时将先呈现给用户。
7.2.1两列的浮动布局
对两列进行左右浮动而不是同时左浮动,原理如下:
7.3固定宽度、流体和弹性布局
7.3.1流体布局
流体布局:使用百分比设置尺寸。
7.3.2弹性布局
以em为单位
7.3.3 弹性-流体混合布局
以em设置宽度,以百分比设置最大宽度。
最新文章
- VS2015调试时没有启动IIS Express Web服务器 或者停止调试时 IIS Express 跟着关闭
- EmployeeTest
- Servlet接口五种方法介绍
- JS学习:第一周——NO.1预解释
- C语言字符串函数例子程序大全 – string相关
- CamanJS – 提供各种图片处理的 JavaScript 库
- JavaScript学习笔记- 自定义滚动条插件
- POI 设置EXCEL单元格格式(日期数字文本等)
- Notepad++前端开发常用插件介绍 - BorisHuai前端修炼 - 博客频道 - CSDN
- 模拟游客一天的生活与旅游java程序代写源码
- C# ACM poj1007
- 解决 cocoapods diff: /../Podfile.lock: No such file or directory 问题
- [DEncrypt] Encrypt--加密/解密/MD5加密 (转载)
- Python学习 - 编写自己的ORM(2)
- 【带着canvas去流浪(8)】碰撞
- 记录Sql2012附加Sql2008的数据库出错的解决方案
- java之servlet学习基础(一)
- 阿里分布式服务框架Dubbo的架构总结
- CROI R1
- SpringCloud学习目录