论文部分内容阅读
摘要：通过详细解析DIV+CSS技术用于网页制作的原理，本文由此推出了DIV+CSS技术在计算机教学中新的解释，提出了在中职计算机教学中如何运用。
关键词：DIV+CSS；计算机教学；教学应用
中图分类号：G712 文献标识码：A 文章编号：1672-5727（2013）05-0172-03
DIV+CSS的网页布局方法现已成为网页设计的行业标准。在计算机专业课教学中，网页设计教学也都是以DIV+CSS布局为中心进行的。笔者在实际教学中发现，DIV+CSS布局这一方法不仅适用于网页制作，还能够灵活运用到其他计算机专业课教学中，甚至运用到其他专业课教学中。
DIV+CSS技术简介
DIV+CSS是当前WEB标准中的一种术语，它是一种网页布局方法，这种网页布局方法有别于传统HTML网页设计语言中的表格（TABLE）布局方式，可实现网页页面内容与表现相分离。DIV可比做容器，它用来进行网页布局，打好网页的框架。CSS是层叠样式表（Cascading Style Sheets）的缩写，用于定义HTML元素的显示形式，是W3C（The World Wide Web Consortium，万维网联盟）推出的格式化网页内容的标准技术，是网页设计者必须掌的技术之一。
如图1所示，每个DIV相当于一个盒子，盒子中存放网页的具体内容，包括图片、文字、动画等。整个网页由很多个DIV“盒子”拼成。
中职计算机教学存在的问题
计算机教学内容多而杂 有些计算机课在中职每个专业都有开设，基本上成为了中职生的必修科目。相对而言，计算机专业也存在计算机教学内容多而杂，课程难度深浅不一，学生学习好似走马观花的问题。几乎每一款流行软件都有涉及，但都停留在入门阶段。
计算机教学形式单一 计算机学科操作性强，相对于其他学科而言，学生动手机会多。但是由于计算机软件的特点，在计算机教学中，一般采用的教学方法基本是案例教学法，教师将知识点通过案例操作一遍，然后学生按教师要求也将实例做出来，或者反复练习。
计算机知识更新快 软件的更新速度是非常快的，学生在高一学习的知识可能在高中毕业时已经完全被新的知识代替。一方面，学生对新的计算机技术有兴趣；另一方面，教师跟不上计算机知识更新步伐。
学生综合运用计算机的知识能力差 学生学习完多款软件后，对单一软件的运用可能较好，但是很多实际问题不是一款软件就能解决的。另外，文化基础差也是中职学生的一大软肋，造成学生的综合能力低下。例如，很多学生无法单独做好一个动画短片，因为做动画短片除了要掌握好基本的动画制作软件Flash等，还需要对音频进行很好的控制；另外，还要自己写好剧本，需要学生良好的写作能力和创作力、想象力的综合运用。
DIV+CSS在计算机教学中的新解
DIV——教学内容结构化 DIV+
CSS一个显著的特点是分离页面的表现与结构。如典型DIV布局图所示，它的结构很清晰，中间有一个DIV嵌套。在计算机教学内容的安排中，也需要结构化、模块化。每一个软件都可以分为几块，比如Flash软件的教学完全可以分为绘图块、Action块、动画块等。DIV布局有一个浮动的概念，在同一行并排布局中起到很重要的作用。通过CSS中改变Float的属性可以实现布局的调整。同理，在教学中对于知识点结构化后，对同一层次的知识点完全可以实现浮动操作。例如，前面提到的Flash三个块中的动画块中包含引导线动画、遮罩动画、逐帧动画等，它们是同一层次，完全可以随意改变它们的学习顺序。
CSS——教学形式多样化 在DIV+CSS技术实现的网页中，可通过改变CSS的设置，实现网页表现的多样化。在计算机教学中，对同样的教学内容除了采用案例教学，项目教学方法外，完全可以采用游戏、竞赛投标等方式进行。对不同层次的学生，同样的内容必须能够提供适合它们的不同教学方式。教师在教学形式上要大胆创新，从其他学科教学形式或流行元素上的基础上开发出多样化的教学形式。实现同样的内容不同的教法、不同的学生不同的教法。
DIV+CSS字母缩写新解 （1）D（Develop，发展）：在教学内容方面，教学的知识注重计算机知识更新的速度，力求选取新的技术知识，对同样的问题，新技术、新方法能解决的就采用新方法。如Flash CS4开始的骨骼工具对制作人物动作能够简单化、科学化，就可以替代逐帧动画中的人物动作制作。（2）I（Interesting，有趣）：在教学内容方面，选取的内容要让学生感兴趣，当然计算机学科中的大部分内容是枯燥的，也是不可不学的，这就需要教师在教学形式上下大功夫，将教学内容由复杂变为简明，由无趣变为有趣。（3）V（Video，视频）：在视频方面包括各种对教学有利的动画资源和各种格式的音视频集合，着重注意对教学形式有利的视频。另外，计算机学科注重操作性，教师每节课在教师机上对案例的演示都可以用录屏软件录制下来，便于不同层次的学生复习。教师自己录制的视频非常重要，因为这是教师根据学生的特点自己选取出来的教学内容，有针对性，比网络上的相关教学视频更能得到学生认同。（4）C（Center，中心）：所有的教学内容和教学形式都要围绕一个中心——以学生为中心。所有的教学手段都是以学生学会知识、学会学习为目标。对计算机教学来说，教师教学的最终目标是让学生掌握对计算机各门学科学习特别是自学的能力，以及综合运用多款软件解决实际问题的能力。（5）S（Solve，解决）：对于中职学校来说，开设的专业科目都是以技能为主，计算机学科也更注重实用性。因此，教学上要注重联系实际，着重对学生解决问题能力的培养，真正做到学以致用。（6）S（Sweat，出汗）：在计算机学科中，软件的学习是一个长期的过程，对实际问题的解决往往需要灵活综合运用几类软件，也是挑战耐心的过程。就算只用到一款软件的学科，要很好地解决实际问题也需要一个“流汗”的过程。例如，设计一个动画，人物设计、场景设计、镜头的运用、音乐的处理、后期的制作，每一个步骤都不能马虎。一个好的作品制作出来是需要流汗的。学生也只有经过这样的过程，才能学会知识、运用知识并体会到学习的乐趣，从而更好地学习。
关键词：DIV+CSS；计算机教学；教学应用
中图分类号：G712 文献标识码：A 文章编号：1672-5727（2013）05-0172-03
DIV+CSS的网页布局方法现已成为网页设计的行业标准。在计算机专业课教学中，网页设计教学也都是以DIV+CSS布局为中心进行的。笔者在实际教学中发现，DIV+CSS布局这一方法不仅适用于网页制作，还能够灵活运用到其他计算机专业课教学中，甚至运用到其他专业课教学中。
DIV+CSS技术简介
DIV+CSS是当前WEB标准中的一种术语，它是一种网页布局方法，这种网页布局方法有别于传统HTML网页设计语言中的表格（TABLE）布局方式，可实现网页页面内容与表现相分离。DIV可比做容器，它用来进行网页布局，打好网页的框架。CSS是层叠样式表（Cascading Style Sheets）的缩写，用于定义HTML元素的显示形式，是W3C（The World Wide Web Consortium，万维网联盟）推出的格式化网页内容的标准技术，是网页设计者必须掌的技术之一。
如图1所示，每个DIV相当于一个盒子，盒子中存放网页的具体内容，包括图片、文字、动画等。整个网页由很多个DIV“盒子”拼成。
中职计算机教学存在的问题
计算机教学内容多而杂 有些计算机课在中职每个专业都有开设，基本上成为了中职生的必修科目。相对而言，计算机专业也存在计算机教学内容多而杂，课程难度深浅不一，学生学习好似走马观花的问题。几乎每一款流行软件都有涉及，但都停留在入门阶段。
计算机教学形式单一 计算机学科操作性强，相对于其他学科而言，学生动手机会多。但是由于计算机软件的特点，在计算机教学中，一般采用的教学方法基本是案例教学法，教师将知识点通过案例操作一遍，然后学生按教师要求也将实例做出来，或者反复练习。
计算机知识更新快 软件的更新速度是非常快的，学生在高一学习的知识可能在高中毕业时已经完全被新的知识代替。一方面，学生对新的计算机技术有兴趣；另一方面，教师跟不上计算机知识更新步伐。
学生综合运用计算机的知识能力差 学生学习完多款软件后，对单一软件的运用可能较好，但是很多实际问题不是一款软件就能解决的。另外，文化基础差也是中职学生的一大软肋，造成学生的综合能力低下。例如，很多学生无法单独做好一个动画短片，因为做动画短片除了要掌握好基本的动画制作软件Flash等，还需要对音频进行很好的控制；另外，还要自己写好剧本，需要学生良好的写作能力和创作力、想象力的综合运用。
DIV+CSS在计算机教学中的新解
DIV——教学内容结构化 DIV+
CSS一个显著的特点是分离页面的表现与结构。如典型DIV布局图所示，它的结构很清晰，中间有一个DIV嵌套。在计算机教学内容的安排中，也需要结构化、模块化。每一个软件都可以分为几块，比如Flash软件的教学完全可以分为绘图块、Action块、动画块等。DIV布局有一个浮动的概念，在同一行并排布局中起到很重要的作用。通过CSS中改变Float的属性可以实现布局的调整。同理，在教学中对于知识点结构化后，对同一层次的知识点完全可以实现浮动操作。例如，前面提到的Flash三个块中的动画块中包含引导线动画、遮罩动画、逐帧动画等，它们是同一层次，完全可以随意改变它们的学习顺序。
CSS——教学形式多样化 在DIV+CSS技术实现的网页中，可通过改变CSS的设置，实现网页表现的多样化。在计算机教学中，对同样的教学内容除了采用案例教学，项目教学方法外，完全可以采用游戏、竞赛投标等方式进行。对不同层次的学生，同样的内容必须能够提供适合它们的不同教学方式。教师在教学形式上要大胆创新，从其他学科教学形式或流行元素上的基础上开发出多样化的教学形式。实现同样的内容不同的教法、不同的学生不同的教法。
DIV+CSS字母缩写新解 （1）D（Develop，发展）：在教学内容方面，教学的知识注重计算机知识更新的速度，力求选取新的技术知识，对同样的问题，新技术、新方法能解决的就采用新方法。如Flash CS4开始的骨骼工具对制作人物动作能够简单化、科学化，就可以替代逐帧动画中的人物动作制作。（2）I（Interesting，有趣）：在教学内容方面，选取的内容要让学生感兴趣，当然计算机学科中的大部分内容是枯燥的，也是不可不学的，这就需要教师在教学形式上下大功夫，将教学内容由复杂变为简明，由无趣变为有趣。（3）V（Video，视频）：在视频方面包括各种对教学有利的动画资源和各种格式的音视频集合，着重注意对教学形式有利的视频。另外，计算机学科注重操作性，教师每节课在教师机上对案例的演示都可以用录屏软件录制下来，便于不同层次的学生复习。教师自己录制的视频非常重要，因为这是教师根据学生的特点自己选取出来的教学内容，有针对性，比网络上的相关教学视频更能得到学生认同。（4）C（Center，中心）：所有的教学内容和教学形式都要围绕一个中心——以学生为中心。所有的教学手段都是以学生学会知识、学会学习为目标。对计算机教学来说，教师教学的最终目标是让学生掌握对计算机各门学科学习特别是自学的能力，以及综合运用多款软件解决实际问题的能力。（5）S（Solve，解决）：对于中职学校来说，开设的专业科目都是以技能为主，计算机学科也更注重实用性。因此，教学上要注重联系实际，着重对学生解决问题能力的培养，真正做到学以致用。（6）S（Sweat，出汗）：在计算机学科中，软件的学习是一个长期的过程，对实际问题的解决往往需要灵活综合运用几类软件，也是挑战耐心的过程。就算只用到一款软件的学科，要很好地解决实际问题也需要一个“流汗”的过程。例如，设计一个动画，人物设计、场景设计、镜头的运用、音乐的处理、后期的制作，每一个步骤都不能马虎。一个好的作品制作出来是需要流汗的。学生也只有经过这样的过程，才能学会知识、运用知识并体会到学习的乐趣，从而更好地学习。