[Web标准CSS+DIV网页布局与美化.pptVIP

CSS的定义是由三个部分构成: 选择符(selector)，属性(properties)和属性的取值(value)。 ccs　语法: selector {property: value} (选择符 {属性:值}) 例子:body {color: black}，此例的效果是使页面中的文字为黑色。 CSS常用属性 1、Height:设置DIV的高度。 2、Width:设置DIV的宽度. 3、margin:用于设置DIV的外延边距，也就是到父容器的距离。 说明：margin:后面跟有四个距离分别为到父容器的上-右-下-左边的距离；可以看例子中的白色DIV到黑色DIV的边距离效果。 还可以分别设置这四个边的距离，用到的属性如下： 4、margin-left:到父容器左边框的距离。 5、margin-right:到父容器右边框的距离。 6、margin-top: 到父容器上边框的距离。 7、margin-bottom:到父容器下边框的距离。 建立一网站主页，用DIV+CSS的样式来实现，要求网站主页由三部分组成：头部、主体及尾部。 PPT由刘鑫整理 * 第一章 Web标准 CSS+DIV网页布局与美化 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 模块一：Web标准 模块二：CSS样式与盒模型 模块三：CSS+DIV布局设计 模块四：CSS美化网页元素 模块五：网站设计实例 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 什么是Web标准 Web标准带来的好处 符合Web标准的设计规则 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 表 格 DIV+CSS 打开所有页面逐一进行修改 修改外部样式表文件(.CSS) 问题 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 数据的组织与显示； 会产生更多的冗余代码； 表格嵌套使浏览器解析缓慢； 网页表现层与结构层混在一起，代码维护、更新麻烦。 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 大大缩减页面代码，提高浏览速度； 缩短改版时间； 容易被搜索引擎搜索到； 样式定义方便； 表现和内容分离 遵循Web标准化设计。 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. Web标准是由W3C(World Wide Web Consortium，万维网联盟)和其他标准组织制定的一套规范集合, Web标准不是某一个标准，而是一系列标准的集合。 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 结构 表现 行为 对应的标准语言 对应的标准语言 对应的标准语言 HTML或XML CSS 对象模型、ECMAScript Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pt