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

回顾: CSS知识 常用属性 width:180px; 宽度 高度 边框 背景颜色 背景图片 字体颜色 字体大小 字体粗细 水平对齐 垂直对齐 height:25px; border-width:1px; border-style:solid; border-color:#aadafe; background-color:#ebf8ff; background-image:url(images/btn_register.gif); color:#1f8f00; font-size:12px; font-weight:bold; text-align:left; vertical-align:top; 任务一: 制作会员注册页面 任务一: 制作会员注册页面 实现步骤 (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) 设置子表格属性 任务二: 制作电影介绍页面 * 《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 样式表的基本语法 多个标签采用相同的样式，所