http://www.blueidea.com/articleimg/2007/03/4545/css2.html彻底弄懂CSS盒子模式(DIV布局快速入门)
RIA知识库
flex
RIA
http://www.blueidea.com/articleimg/2007/03/4545/css1.html
<style type="text/css">
<!--
* {
margin: 0px;
padding: 0px;
}
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
margin: 0px auto;
height: auto;
width: 760px;
border: 1px solid #006633;
}
#header {
height: 25px;
width: 740px;
background-image: url(headPic.gif);
background-repeat: no-repeat;
margin:0px 0px 3px 0px;
background-color:#006633
}
#nav {
height: 25px;
width: 740px;
font-size: 14px;
list-style-type: none;
}
#nav li {
float:left;
}
#nav li a{
color:#000000;
text-decoration:none;
padding-top:4px;
display:block;
width:97px;
height:22px;
text-align:center;
background-color: #009966;
margin-left:2px;
}
#nav li a:hover{
background-color:#006633;
color:#FFFFFF;
}
#content {
height:auto;
width: 740px;
line-height: 1.5em;
padding: 10px;
}
#content p {
text-indent: 2em;
}
#content h3 {
font-size: 16px;
margin: 10px;
}
#footer {
height: 50px;
width: 740px;
line-height: 2em;
text-align: center;
background-color: #006633;
padding: 10px;
}
-->
</style>
<body>
<div id="header">
<ul id="nav">
<li><a href="#">首 页</a></li>
<li><a href="#">文 章</a></li>
<li><a href="#">相册</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">论 坛</a></li>
<li><a href="#">帮助</a></li>
</ul>
</div>
<div id="content">
<h3>前言</h3>
<p>第一段内容</p>
<h3>理解CSS盒子模式</h3>
<p>第二段内容</p>
</div>
<div id="footer">
<p>关于*** | 广告服务 | ***招聘 | 客服中心 | Q Q留言 | 网站管理 | 会员登录 | 购物车</p><p>Copyright ©2006 - 2008 Tang Guohui. All Rights Reserved</p>
</div>
</body>
分享到：
相关推荐
彻底弄懂CSS盒子模式..... 一些精华所在。。。。
CSS盒子模式(DIV布局快速入门)，关于前台的设计必须的。
CSS盒子模式(DIV布局快速入门)[收集].pdf
推荐彻底弄懂CSS盒子模式(DIV布局快速入门)
保证你能彻底明白css的盒子模型，我就看完了这个讲解就彻底的可以css+div布局了,千万不要错过
彻底弄懂CSS盒子模式系列教程集合
但Word 2007目前并不支持很多Html语言及CSS样式，也就意味着Outlook 07中邮件背景图片无法显示、不支持CSS的Float或Position属性、不支持DIV+CSS盒子模式等等。 因此，这个变化在很大程度上影响到Html邮件在Outlook ...
而是用CSS来排版你的网页，也就是常听的用DIV来编排你的网页结构，又或者说你想学习网页标准设计，再或者说你的上司要你改变传统的表格排版方式，提高企业竞争力，那么你一定要接触到的一个知识点就是CSS的盒子模式，...
DIV CSS 盒子模型PPT演讲！ HTML中 常见技术 盒子模式，网页设计基础同学可以用心，收获学习。
弹性盒子是 CSS3 的一种新的布局模式。 CSS3 弹性盒（ Flexible Box 或 flexbox），是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。 引入弹性盒布局模型的目的是提供一种...
2.css的元素显示模式 html元素一般分为块元素和行内元素 （1）块级元素 div p h1-h6 ul ol li ①独占一行 ②宽度 高度 外边距 内边距都可控制 ③宽度默认是容器（父级元素）100%的宽度 ④是一个容器及盒子 里面...
css资料 # 课程目标: > 1. 学会使用CSS选择器 > 2....> 3....> 4....> 5. 熟练掌握CSS三种显示模式 > 6.... 熟练掌握CSS盒子模型 > 9. 熟练掌握CSS浮动 > 10.熟练掌握CSS定位 > 11.熟练掌握CSS高级技巧强化CSS
而是用CSS来排版你的网页，也就是常听的用DIV来编排你的网页结构，又或者说你想学习网页标准设计，再或者说你的上司要你改变传统的表格排版方式，提高企业竞争力，那么你一定要接触到的一个知识点就是CSS的盒子模式，...
资源名称：CSS基础知识内容简介：0、基础知识1、CSS概述2、CSS基础语法3、CSS选择器4、CSS主要属性5、CSS核心机制-盒子模型6、CSS重点和难点-定位7、综合示例浏览器模式 当浏览器厂商开始创建于标准兼容的浏览器时...
精通CSS+DIV网页样式与布局 视频教材主要内容 迅雷下载地址： 目录 第1部分 CSS基础知识篇 第1章 CSS的初步体验 1.1 CSS的概念 1.1.1 标记的概念 1.1.2 传统HTML的缺点 1.1.3 CSS的引入 1.1.4...
6 一、利于搜索引擎蜘蛛爬行 6 二、易于修改 7 三、减少网页加载时间 7 四、代码精简 7 五、相对表格的嵌套问题 8 六、搜索排名的影响 8 第四节 div+css布局方式 8 第五节 div+css理论概述 9 一、理解CSS盒子模型 9 ...
04-盒子阴影 05-文字阴影 06-滑动门技术 07-内减模式 08-过渡 09-商品偏移过渡 10-背景位置也可以实现过渡 11-泡泡小按钮 12-2D转换之移动 13-移动是移动至某一个点 14-旋转 15-缩放 16-鼠标以上图片放大特效 17-...
css基础：元素显示模式，背景样式，css三大特性，盒子组成部分