前端网页设计高职高专.ppt

知识点： （三）CSS元素分类 1、块级元素 (display:block)每个块级元素都从新行开始，其后元 素也要另起一行开始，如div 2、内联元素 (display:inline)不需要在新行内显示，其后元素也不 必另起一行，如span 3、列表项 (display:list-item)和列表类似 块状元素与内联元素区别 块状元素 内联元素 最大区别：块状元素可以定义大小，即设置宽度、高度属性 知识点：(四)盒模型 (边距、填充距) left 内容宽度、边距、填充据、边框之间的关系，如下图所示： 知识点：(四)盒模型  (边距、填充距) 整个区域宽度？ =20+10+40+200+40+10+20=340px 边框默认样式为0(即不显示)； 填充距padding不可以 为负； 如果盒中为空，即使定义了宽度高度为100%，实际上只占0%，因此不会被显示。 left 任务实施 ：网页对象布局(文本/图像设计) 请根据“盒模型”规则，如图示使用DW在网页上设计一块区域： 内容宽度：600px 填充距：20px，左右一致 边框：10px，包括四周 边距：30px，左右一致 区域内容：文本和图像编辑各一 课后作业 完成本次课任务3-子任务1实施总结和第4次课任务3-子任务2实施准备 上传: FTP:///up/ 第2周作业 注意：作业文件夹一定要按命名规则命名 * 书名：前端网页设计 ISBN： 978-7-111-44372-8 作者：杜黎强 出版社：机械工业出版社 本书配有电子课件 第1次课教学回顾 教学导入 教学实施 任务实施准备页检查 知识点讲解 任务实施 请大家完成本次课课中页：任务2-实施过程.doc 第2次课教学内容及实施环节 项目准备：任务2 应用web2.0标准区分HTML与XHTML文档 分发本次课所用文件 项目准备-任务2(任务实施过程).doc 项目准备-任务2(任务实施总结).doc 项目准备-任务3–子任务1--任务实施准备.doc 知识点：(一)概念(2个) (1)W3C组织:(World Wide Web Consortium, 万维网联盟) 是一个专门负责网络标准制定的非赢利组织,诸如HTML、 XHTML、CSS、XML等标准都是W3C制定的。 2. W3C会员包括生产技术产品及服务的厂商、内容供应商、 团体拥护、研究实验室、标准制定机构和政府部门，会员一起协同工作，致力在万维网发展方向上达成共识。 (2)Web标准 是由W3C和其他标准化组织制定的一套规范集合; 目的是创建一个统一的用于Web表现层的技术标准; 通过不同浏览器或终端设备向最终用户展示信息内容。 知识点：(二)Web标准由3大部分组成 对应的标准语言也分三方面： 结构化标准语言(HTML、XHTML和XML) 表现标准语言(CSS) 行为标准(对象模型:W3CDOM、ECMAScript) 结构(Structure)：对网页中用到的信息进行分类与整理 表现(Presentation)：对信息进行版式、颜色、大小等形式控制 行为(Behavior)：文档内部的模型定义及交互行为的编写 Document Object Model文档对象模型:浏览器与网页内容结构之间的接口，使用户可以访问页面上的标准组件 脚本语言，用于实现具体界面上对象的交互操作 欧洲电脑厂商协会(European Computer Manufacturers Association) 提问 1、结构标准语言 在网页中主要对网页信息起到组织和分类的作用： (1) XHTML (The Extensible HyperText Markup Language，可扩展超文本标记语言)。W3C于2000年1月20日推出XHTML1.0版本。 (2) XML (The Extensible Markup Language，可扩展标记语言)，W3C于1998年2月10日发布XML1.0，于2000年10月6日发布XML1.0(SE)第2版。是一种能定义其他语言的语言，最初设计的目的是弥补HTML的不足，以强大的扩展性满足网络信息发布的需要，逐渐用于网络数据交换标准的格式 2、表现标准语言 在网页中主要对网页信息的显示进行控制，即 如何修饰网页信息的显示样式 CSS (Cascading Style Sheets，层叠式样式表)， W3C于1998年5月12日发布的CSS2，创 建的目的就是使用CSS取代HTML中结构与 表现混淆的弊端，使站点访问与维护更加容易 3、行为标准语言 在网页中主