静态页面培训(一期)课件.ppt

《静态页面培训(一期)课件.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、WEB前端界面开发培训第一期界面设计组2011年07月前言分析静态页面制作问题来源于三个方面：一：静态页面的代码没有系统的学过，不太熟系，也不常用；二：对自己制作静态页面的能力有所质疑，不愿意尝试，在这方面不自信；三：从心理上抗拒，认为不应该由自己的来做。21静态页面的基本知识Html常用的标签3怎样从静态页面中取用表格和div?4怎样修改表格和div?目录第一章：静态页面的基本知识静态页面常用的构造方式：一：表格（table）构造方式：优点：可以方便灵活的排版，表格可以把相互关联的信息元素集中定位，并且少有浏览器兼容问题；缺点：表格层级深，要全部加载完成才能显示出来，可能导

2、致页面速度慢。适用：表单、列表、信息输入等展示方式二：div+css构造方式：优点：缩减页面代码，提高页面浏览速度，样式控制，修改方便；缺点：技术难度较高，工作量比较大；样式修改，需要一定基础，编写要求高，对浏览器的兼容也有要求。适用：整体框架的构造、元素复用高的的网站三：两者结合的构造方式：比较常用，适合大型网站，两者结合，各取所长。四：对比：每种方式都是可取的，好的页面设计应该根据设计网站的难易程度以及网站的功能性等因素，决定选择哪款构造方式，不管是哪种构造方式，合理的布局、代码简洁、注释的齐全是构造页面的必须条件。第一章：静态页面的基本知识HTML文件结构标签

3、>.........例子1：正文写在这里......调用外部cs、js文件的代码，可以调用多个。第一章：静态页面的基本知识Body——主体标签Table——表格标签Div——层标

4、签Html页面的常用元素Body的常用属性背景颜色背景图片页面滚动顶部页面空白(Margin)左边页面空白(Margin)右边页面空白(Margin)底部页面空白(Margin)第一章：静态页面的基本知识Body——主体标签Table——表格标签Div——层标签Html页面的常用元素标签

5、描述

6、格的高度colspan横向合并rowspan竖向合并align内容水平定位，值：left,center,rightValign内容垂直定位，值：top,middle,bottombackground表格的背景图片bgcolor表格的背景颜色border边框cellspacing单元格之间的间距cellpadding单元格内容与边界之间的间距table实例：

7、r>