5.2.2CSS样式表.ppt_第1页
5.2.2CSS样式表.ppt_第2页
5.2.2CSS样式表.ppt_第3页
5.2.2CSS样式表.ppt_第4页
5.2.2CSS样式表.ppt_第5页
已阅读5页,还剩8页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

1、一中,秀,style,无锡一中高二(8)班一位同学制作了一个一中style秀的网站,他想通过网站展现一中人的精神风貌,展示八班风采,但是,在制作过程中,由于对style样式表掌握不够熟练,网页中出现了一些问题,问题提出:,浏览网站:,style样式表:网页的化妆师,样式表的基本语法:,样式名 属性: 属性值; 属性: 属性值; ,例如: p font-family:黑体;color:blue;font-size:12pt .s1 font-family:隶书;color:red;font-size:15pt ,其中样式名中可以是html的标签名,也可以自己定义,但需要在名称前加“.”。,sty

2、le,样式表的三种使用方法,style,嵌入样式, 在这里使用了嵌入样式 ,内联样式, .afont-family:宋体;font-size:12pt;color:blue , 在这里使用了a的样式 ,外联样式, 在这里使用了a的样式,“mystyle.css”中的内容如下: .afont-family:宋体;font-size:12pt;color:blue,学习活动一:改正错误,1、打开wxyz1.htm,切换至HTML窗口,找出样式表中的错误,改正后保存网页;思考:它采用了什么样式表? 2、打开wxyz2.htm,切换至HTML窗口,找出样式表中的错误,改正后保存网页;思考:它采用了什么

3、样式表? 3、打开wxyz3.htm,切换至HTML窗口,找出样式表中的错误,改正后保存网页;思考:它采用了什么样式表?,启动FrontPage软件,使用“文件打开站点”命令,打开桌面上的CSS文件夹。,语 法,位 置,拼错单词,写错标点了!,写 错 地 方了!,小结1:分析错误原因?,学习活动二:自主探究,1、为四张网页的标题和超链接制作统一的样式并实现;思考:可以采用什么样式表? 2、打开wxyz4.htm,参考学习资源,使用样式表美化“我们”的网页,秀出高二(8)班的风采,秀出一中学生的风采。思考:你准备采用什么样式表?,学习活动三:展示交流,1、保存好后,将css文件夹中的wxyz1.htm、wxyz2.htm、wxyz3.htm、wxyz4.htm以及样式表文件和图片文件上传至个人空间,标题是“我的style秀”,第四章第四节。 2、点击“班级作品”,观看同学的作品,互相交流。思考:三种样式表的特点和使用技巧。,小结2:三种 样式表适用场合?

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论