PHP程序设计案例教程陈建国第2讲第2.2讲CSS知识巩固课件教学.pptVIP

* * * 任务一: 制作会员注册页面 任务一: 制作会员注册页面 实现步骤 (1) 编写HTML代码__不设置属性 (2) 设置页面\表格属性 (3) 设置文本框\按钮属性 单元格合并 colspan=“合并列数” rowspan=“合并行数” 任务一: 制作会员注册页面 实现步骤 (1) 编写HTML代码__不设置属性 相关知识点 1) 新建网站文件夹 2) 新建网页”会员注册.html” 3) 编写HTML代码. 任务一: 制作会员注册页面 实现步骤 (1) 编写HTML代码__不设置属性 相关代码: 外部样式表使用 任务一: 制作会员注册页面 实现步骤 (2)设置页面\表格属性 相关知识点 1) 新建样式文件”外部样式表.css” 2) 为”会员注册.html”添加样式表引用 3) 编写相关标签的样式 4) 调用相关标签样式 任务一: 制作会员注册页面 实现步骤 (2)设置页面\表格属性 相关代码: 外部样式表使用 任务一: 制作会员注册页面 实现步骤 (3)设置文本框\按钮属性 相关知识点 1) 继续在”外部样式表.css” 编写相关标签的样式 4) 在”会员注册.html”页面调用相关标签样式 任务一: 制作会员注册页面 实现步骤 (3)设置文本框\按钮属性 相关代码: 任务二: 制作电影页面 实现步骤 (1) 编写HTML代码__不设置属性 (2) 设置页面\顶层表格属性 (3) 设置子表格属性 任务二: 制作电影介绍页面 在线教务辅导网： 更多课程配套课件资源请访问在线教务辅导网 馋死 PPT研究院 POWERPOINT ACADEMY 《PHP程序设计》 --教师姓名 */39 第2.2 CSS知识巩固 教师姓名 教研室名称 2012年01月01日 机械工业出版社 1. CSS的基本语法 2. 行内样式表 3. 内部样式表 4. 外部样式表 内容要点 CONTENTS  5. CSS样式表设置 样式表能实现内容与样式的分离，方便团队开发 为什么需要CSS样式表 程序员写代码 美工做样式 内容与样式和谐统一的完整网页 height border 基本属性 width bgcolor background color HTML知识回顾 table style=“width:100px; height:200px” trtd/td/tr /table 现设置表格宽度. HTML知识回顾 新的属性写法 table width=“100px” height=“200px” trtd/td/tr /table 1 样式表的基本语法 style=color:red; font-size:30px; font-family:隶书} 属性 属性的值 height border 2) 基本属性 width bgcolor background color height border width Backgournd-color Background-image color 1 样式表的基本语法 CSS样式 style= 1 样式表的基本语法 行内样式 内嵌样式 外部样式表 CSS的声明方法 2 行内（行间）样式表 HTML HEAD TITLE设置属性/TITLE /HEAD BODY P style = color:red;font-size:30px;font-family:隶书; 这个段落应用了样式 P 这个段落按默认样式显示 /BODY /HTML 为标签p指定样式 本段P标签采用了行内样式 STYLE type=text/css .red1 { color:red; font-family:隶书; font-size:24px; } …… /STYLE 如果一个页面有多个标签使用同一种效果，怎么办？ 2 样式表的基本语法 多个标签采用相同的样式，所以要为它们定义一个共享样式。 内部样式表 选择器(选择符) 样式规则 1 样式表的基本语法 行内样式 内嵌样式 外部样式表 CSS的声明方法 2 内部（内嵌）样式表 HEAD TITLE样式规则/TITLE STYLE type=text/css .red1 { color:red; font-family:隶书; } /STYLE /HEAD BODY H2 class=red1静夜思/H2 P class=red1床前明月光，/P P class=red1疑是地上霜。/P P我是郭德刚，/P