网页意义与设计制作 第1篇
摘要：通过对传统教学模式的调查研究，了解到传统模式逐渐无法满足学生的需求。项目教学法作为一种新的教学模式，在《JSP动态网页设计》课程中是一种新的尝试，通过学生自己完成项目的方式，自主学习JSP网页设计，整个过程由学生自己负责设计，实施，对提高JSP教学的效果有着显著的指导意义。
关键词：项目教学法;教学改革;JSP动态网页设计;步骤
通过对项目教学法的研究，选取与JSP网页设计课程相关的项目来创设“情境”[1]，让学生主动从零到一，完成自我思考，自我学习，自我强化的过程，认证搜集资料并进行整理，充分整合资源，发挥学生的自主创新精神，最终完成整个JSP动态网页设计的学习。
一、概述
高职院校为了实现毕业生和企业直接对接的目标，在学生的培养方面主要是注重学生动手能力的培养，为了实现这一目标，项目教学法是最为合适的一种教学方法。该方法已经成为高职各科课程教学中必选方式之一了。明达职业技术学院的《JSP动态网页设计》这门课程也采用了该方式组织课堂教学，该门课程的实践能力要求较高，社会只用性很强，是专业核心课程。主要选用项目是”基于JSP的学生管理系统”，从部分功能开始，讲练结合，让学生做到能在理论的基础上，举一反三实现理论到实践的转化。课程结束时，学生应具备了了解软件开发的过程，熟悉开发工具，掌握理论实践的操作。
二、项目教学法的含义
项目教学法是在教师的指导下，将一个相对独立的项目由学生小组自己进行资料收集，方案设计，由学生自己评价项目实施的成果，学生通过该项目，了解和掌握在整个过程中每一环节的基本要求。“项目教学法”的特点是最显著的项目为主线，以指导教师为主导、学生为主体”，体现在：多目标;培训周期短，速度快;可控性好;注重理论与实践相结合。项目教学法是教师和学生共同完成项目的一种教学方法[2]。在项目教学法的实施过程中，教师将需要解决的问题通过对学生设立项目的形式来呈现，一本每个项目都会有具体的任务要求和说明，学生通过老师发放的项目要求任务书来设计项目，负责整个项目的设计和实施。通过小组协同工作的方式，自学完成，期间有任何不懂得问题可以咨询导师，导师相当于是学生的左右手，有什么不懂的随时可以寻求帮助，给予学生一定的指导。最后学生共同根据项目制定计划，完成分工，搜集项目的资料并将进行整理，在实践中发现问题，分析问题并解决问题。
三、《JSP动态网页设计》运用项目教学的意义
(一)《JSP动态网页设计》教程简介
《JSP动态网页设计》是计算机专业学生学习的一门核心课程，其实践性较强，不但要通过日常的书本上的学习，还要在计算机上反复实践操作才能掌握。JSP全名为JavaServerPages，中文名叫Java服务器页面，是一种网络程序设计语言，用来开发动态网站[3]。它和JAVA的特点很相似，都简单易操作，全面向对象，平台安全可靠且无相关性。使用java编程语言的类标签的XML脚本的JSP技术，对动态网页的处理逻辑[6]。网页也可以通过标签和服务器应用逻辑脚本资源访问。显示器的分离设计，JSP页面逻辑和网络，为支持可重用的基于组件的设计，使基于Web的应用程序的开发变得迅速和容易。很多高校基于这些特点，都将其作为计算机专业学生继学习JAVA后的有一门必修课程。但是由于其难度和枯燥性，很多学生表示很难驾驭得了，在步入社会以后，所学的知识没能发挥在工作上，从而降低了整个行业的就业质量。
(二)在JSP课程中应用项目教学法的重要性
在传统的JSP课程教学中，学生通常按照课程的标准先学习一部分的基础内容，后期通过简单的上机操作进行理论的巩固，在这种教学模式下，学生很大一部分在前期就已经丧失了学习JSP的兴趣，后期的上机练习也只不过是现在教学的一种硬性要求，对于真正想要学习的学生无疑是一种沉重的枷锁，学生学习的效果很差。但是通过运用项目教学法，将课程的标准以项目完成的方式分成若干块，学生通过完成项目任务来获取学分，在项目中自学，不用拘泥于传统教学模式下的上课，学习更自由了，学习的动力也更强了，这在很大程度上提高了学生的学习积极性和学习的热情。
四、项目教学的应用步骤
(一)培养目标的确定
高职院校“JSP动态网页设计”课程必须确定其具体的知识培训的目标、能力和情感与相应岗位职业能力目标[1]。1.知识目标：通过本课程的学习，熟练掌握配置JSP开发环境;熟练掌握JSP脚本元素、指令元素的用法;熟练掌握JSP中内置对象的特点及用法;熟练掌握JDBC访问数据库技术;熟练掌握JavaBean组件的基本知识;熟练掌握JSP中的标准动作标签;熟悉Servlet的通信方法，掌握Servlet的上下文接口;掌握JSP中标签的用法;掌握JSP中Filter过滤器的用法;掌握应用JSP进行WEB程序开发的能力，初步具备开发实际应用程序的能力;2.能力目标：能熟练使用eclipse软件，实现学生管理系统的注册登录功能;信息添加删除功能;查找等功能;能解决开发过程中出现的各种错误提示;测试完成。3.情感目标：具备较强的规范意识、较强的市场竞争力和承受压力的能力、良好的学习习惯，具备自主学习和团结合作、创新能力。
(二)教学项目的划分
该项目是确定项目教学成功实施的关键因素，必须根据企业对学生工作任务的能力要求进行分析，结合学生的认知特点和接受能力，合理选择项目。并根据企业的工作流程，明确项目的任务，我院JSP动态网页设计”课程的项目被确定为：
(三)教学方式的选择
高职《JSP动态网页设计》课程可设定多媒体讲练结合、岗位调查、学校实验室项目培训、联系个别实习企业，让学生置身于企业中去参与项目的进展，充分利用各种教学资源，丰富教学形式，提高学生的学习兴趣，突出课程的实践性强的特点，从解决实际问题出发，提高学生的创新能力和自学能力。
(四)教学方法及过程的组织
1.从学生角度教师进行项目教学时，应重点侧重于学生自我实践能力的加强。以程的核心内容为项目依据为学生制定任务，并确保每个项目都是由简到易，层层递进，充分调动学生的学习兴趣。尽量选择和生活贴近的案例和素材，如布置的学生管理系统项目，利用情境教学法，让学生更好更有效地学习。在项目完成后，教师可以分别让组员互相做出评价和改进方案的建议，上交个人作品作为课程结束的作业。学生在交流中与老师互动，老师在学生做项目的时候可适当提出意见完善项目并修改，将理论与实践有机结合起来。2.从教师角度教师在授课之前应该做好项目的备案，充分考虑到学生对所选项目的适应性和项目本身的难易程度。在上述帮助学生加强实践能力的同时，提升自我的修养和学识。在实施之前，授课老师应对项目教学有一定的认知和了解，在具体应用中将理论知识与项目的实践应用融会贯通并传授给学生。自己在项目经验方面也要多下功夫，提升自己，提高教学服务的质量，培养出更一流的学生。实践能力的提升并非一蹴而就，在日常生活中教师还要多多接触社会中有关专业方向的工作要求，并及时反馈给学生，让学生及时了解到社会所需要的人才结构。项目教学应用是学生和老师互相学习的过程，是共同进步的纽带。不仅仅是学生自身能力的提高，也是老师对完善多年教学模式的一种新的认知。
(五)考核方案的设置
适应项目教学需要，为培养学生的综合能力，对学生的.考核也要注重过程化的考核，鉴于课程实践性强的特点，重点考核学生的软件操作和软件开发、处理能力，本课程主要采用以下几个部分进行考核：1.平时表现考核占总成绩的60%，由平时出勤、课堂表现和作业等内容构成。2.分阶段、分项目考核占总成绩的40%，即最终整体项目的考核情况3.根据上述各项成绩按比例总评得出考核结果。不再进行传统的期中考试项目教学法在《JSP动态网页设计》实施教学中的注意事项1.排课安排要以半天或一天为单位进行排课，和以往的以一节或2节有所区别;2.班级人数不宜过多，应该在20至30人之间。
结束语
项目教学法的实施，有利于丰富和发展全国计算机专业学生的教学模式，提高计算机人才进入就业市场后的适应能力，最大程度地满足经济建设和社会发展的需要。21世纪的信息时代，学生更需要接受像项目教学法这样的教学模式而非传统教学，这是一种新的尝试，更进一步地发挥了学生自主学习的能力，打破了以往刻板的教学，体现了高等教育的特色，这样学校才能够更好地培养出有效的高素质的技能型人才。
参考文献
[1]欧志先._动态网页设计(JSP)_项目教学法初探[J].科学咨询,20xx,(7):79.
[2]杨文.《JSP动态网页设计》项目教学法的研究与实践[J].福建电脑,20xx,25(8):206,204.
[3]李阿芳.项目教学法在《JSP网页设计》课程中的应用研究[J].电脑知识与技术,20xx(18)
[4]赵海冰,李瑛,邢翠芳.浅谈项目教学与任务驱动在“C程序设计”教学中的应用[J].计算机工程与科学,20xx(z2).
[5]王向阳,李东,张惠玲.项目教学法在程序设计课程教学中的应用[J].价值工程,20xx(6)
[6]陈民.基于J2EE学生网上评教系统的系统设计[J].电脑知识与技术,20xx(12)
网页意义与设计制作 第2篇
［摘要］校企共教是现代社会发展中形成的新型教学方式，中职院校在引导学生设计和制作网页时，强化校企共教能够有效增强学生的职业意识，提升学生的职业素养，综合探究中职院校在课程教学中实施校企共教的具体策略，希望能够使现代中职院校得到更大的发展。
［关键词］校企共教；中职；网页设计与制作；课程教学
在现代科技发展过程中，网站制作得到了很大的发展，对其相关人才也提出了更高的要求，中职院校在具体实施教育工作时，需要科学改进传统教学模式，强化校企共教，确保人才建设能够高度满足现代企业建设需求，为了进一步明确中职院校如何更为有效地落实校企共教，特此实施本次教育研究，希望对大家有所启发。
一、开发校本教材
运用校企共教开展教学工作，培养学生专业技能和专业知识是其教育工作的主要目的，所以教师需要科学地改革教学内容。以往教学要用的教材，运用相对落后的知识体系、应用年限、出版和编写会对教材造成很大影响，使其无法实现与时俱进，为了确保学生专业知识学习能够迎合企业发展方向，职业学校需要进行校本教材的合理开发，由专业骨干教师和企业专家共同参与编写。在教材中融入最新的应用软件、创意方向和设计理念。企业技术骨干的合理融入，可以使网站设计和内容具有更为充分的创新性和实用性，学生通过学习校本教材，能够充分掌握设计和制作网页的最新知识，对学生未来就业创造良好条件，顺应职业教育的培养特点，提升我们的教学质量。例如，为电子商务专业开发网页设计与制作校本教材时，请当地电商产业园的网店美工技术人员，针对当地特色物产，结合本地历史文化，编写商品网页文案撰写相关教学内容，以及设计相应物产推广和营销的网页案例范本，将职业场景、软件知识、行业知识有机融合，让学生通过开发的校本教材掌握知识点、技能点，实现校内实训与企业实习就业的无缝衔接。
二、制订教学目标
在现代中职院校发展中，校企合作已经得到了很大的发展，教师在具体落实课程教学时，如何引进企业资源是其教育工作难点问题。此时，学校需要和企业进行有效的合作，共同设置教学内容和教学目标，确保学生能够更高效地学习网页设计，实现教学质量的有效提升，进而保证课堂教学目标和教学内容可以高度满足企业需求。在具体学习设计和制作Dreamweaver网页之前，教师首先需要组织学生进行图像处理的学习，夯实学生的专业基础，确保学生能够有效处理多媒体素材和网页设计图片，此时，学生能够结合个人想象开发作品。教师在具体实施网页设计教学时，不仅需要确保学生能够熟练应用相关网站的基本操作，而且需要确保学生能够设计制作相关网站，实现学生综合能力的有效提升。在具体开展科创教学时，自主开发一个网站是其教育工作的最终目标，因此，教师在具体开设网页设计课程之前，需要考虑知识的连贯性，确保学生能够掌握商品拍摄与图片处理，以及熟练应用Photoshop、Flash、Firework等软件，为网站整体布局和图像处理创造良好的条件，确保学生能够独立建设静态网站，进而保障学生后期能够更高效地参与企业工作。例如，电子商务专业学生使用校企共编教材设计商品推广与营销网页之前，首先需要拍摄收集商品素材，并利用Photoshop软件对商品素材进行处理、美化，然后根据处理后的商品素材，撰写相关文案，再对图片和文案进行排版和美化，最后运用Dreamweaver，结合Flash、Firework等软件完成商品推广与营销网页的制作。
三、理论结合实践
四、改进教育模式
在以往实施网页设计课程时，通常由教师在课堂上向学生演示相关案例，然后要求学生模仿该案例，最后由学生设计和制作相关网页，教师普遍采取照本宣科和“填鸭式”教学实时课堂内容教学，教学活动的乏味性相对较强。针对该情况，教师需要对其教学模式进行科学改变，确保能够对学生学习兴趣进行有效激发，实现整体教学效果的有效提升[1]。例如，在进行网页设计基础的相关内容教学时，中职学生对事物具有独特的看法，尤其是面对自己感兴趣的动漫人物、电影明星和游戏时，具有相对开阔的思路，会自我设定角色。因此，教师在具体进行该部分教学时，需要科学改变课程教学，对传统教学模式进行有效突破，在向学生讲述制作网页的技术和方法时，还需要加入设计风格、网页主题、网页布局、网页设计等细节，引导学生自由选择，通过该方式，可以使学生具有充分的自主权，确保学生能够结合个人兴趣进行网页设计，完善相关作品，不仅能够使学生更高效地学习网页设计，而且可以对学生的创新能力进行科学培养，实现学生整体设计水平的全面提升。在对电子商务专业学生实施教学时，学生根据自己的喜好，为本地特产鱼圆设计了宣传海报。
五、设置工作任务
利用工作任务实施项目教学具体是指教师根据单元所学内容创设教学情境，确保教学内容能够合理融入职业工作内容中，在项目教学中融入典型工作任务，与企业生产实际有效结合，确保教学内容中有学生必须掌握的理论知识，同时，教师还可以根据教学需求对其进行科学分解，使其形成多个小项目单元，进而保障学生能够进行更为有效的学习。例如，在进行开发与设计Web网站教学时，教师可以在教学活动中贯穿电子商务购物，结合具体工作流程对该工作任务进行简单分解，同时，将理论教学融入其中，确保教学活动能够有效结合真实工作岗位，进而保证能够更高效地实施项目教学，在此过程中，我们的工作任务设置要紧密结合产业需求，将学校的教学和企业的需求进行深度融合。
六、确保因材施教
中职类学生在参与学习时，具有不同的学习兴趣、专业能力和专业基础，所以，教师在进行人才培养时，无法使学生完全掌握行业所需内容，同时也无法批量生产。部分学生具有良好的口才，同时，还有学生对色彩极其敏感，部分学生擅长编码技术，针对该情况，教师需要确保教学工作因材施教。例如，在具体开展教学活动时，教师需要引导学生扮演不同角色，从而完成不同任务，教师可以引导学生根据个人兴趣选择角色，然后实施分组教学，对学生的兴趣进行科学培养[2]。如果学生市场嗅觉敏感、口才良好，教师则需要侧重于培养网站架构和调研，而如果学生色彩感觉好，美工功底强，教师需要将网页美工设计作为人才培养的侧重点。最后，如果学生对编码技术具有较高的兴趣，教师则需要培养学生编写后台代码，实现网站技术。因材施教的有效落实，可以确保学生具有较高的学习兴趣，使学生能够迅速掌握未来所需的专业技能，从而毕业的时候可以轻松地适应未来的就业岗位。
七、引进企业专家
中职院校在实施教育工作时，如果想要确保班级教学有效结合企业教学，需要科学引进企业专家，科学讲解课堂内容和企业内容。在课堂教学中引入企业专家具有较高的难度。针对该情况，教师可以利用网络手段组织学生开展网络连接学习，确保课堂教学可以和企业文化有效融合，使学生对企业相关信息有充分的了解，同时，还可以引导学生对网站设计的最新技术进行深入学习，对学生职业素养、职业荣誉、职业良心和职业责任进行科学培养[3]。例如，在实施添加和设置多媒体对象的相关内容教学时，教师可以引进企业专家进行教学，企业专家在具体讲解中，可以根据自身工作经验，简单介绍企业网站对多媒体资源的需求，可在网页中插入多媒体资源的具体方法，然后进行影片和声音插入方式的科学讲解，通过开放式可以对学生学习兴趣进行有效激发，使其能够迅速掌握该知识点。与此同时，在具体进行该章节教学时，企业教师可以讲解相关视频。例如，在详细讲解添加视频时，企业专家可以利用多媒体向学生讲解自己的企业，在进行教育工作的同时，还可以对学生输出企业文化，实现教学效率的有效提升。又如，在进行网页页面布局的相关内容教学时，通过视频讲解，可以使学生进一步理解所学内容，教师在完成课程教学之后，还可以利用班级群对学生设计和制作网页学习提供必要的帮助，帮助学生解决在具体实践中出现的问题与疑惑，并对其网页设计技术进行分享。
八、强化项目教学
在开展实训课程时，教师可以合理应用项目任务教学，针对职业岗位需求实施教育工作，对企业工作情境进行科学模拟，推广过程导向、案例解析、情景体验、任务驱动等多种教学方式，确保能够使工学结合得到充分体现。针对网站建设的具体流程和工作任务，根据实际岗位团队进行项目组的合理设置，基于职业情境创设学习情境，确保能够使学生合理融入学习情境，使其能够对自身具有经验进行合理应用，主动获取相关信息，明确实际岗位的操作流程和具体要求。在具体实施网页设计制作的相关内容教学时，教师需要针对教学内容设计具体工作项目[4]。首先，需要明确任务，教师需要针对教学内容设置学习任务，并对学生进行效果预览图的展示，使学生对其任务要求有充分的了解。借助教学平台发布思维导图、学习任务书、任务效果图等，引导学生构建知识体系，自主学习、小组探究多方面提升学生的综合能力和素养，由此构建任务驱动课堂。其次，需要科学制订工作计划，学生需要针对教师引导对项目任务进行科学分级，设定具体工作计划。例如，制作“宅家商城”网站主页，在明确任务后，学生根据网页效果图，制订工作任务计划思维导图，对任务梳理、分级。随后，教师还需要引导学生根据工作计划收集相关资料，并为其项目工作准备所需素材，然后学生需要针对工作计划设计和制作页面，并利用文字对其进行记录。最后，需要进行检查评测，学生需要将个人作品进行展示，然后由教师对其进行提问，组织学生答辩和互评，并由教师对其进行科学讲评，从而不断提升学生的创作水平。
九、结语
中职院校在具体落实网页设计与制作的相关内容教学时，通过开发校本教材，制订教学目标，理论结合实践，改进教育模式，设置工作任务，确保因材施教，引进企业专家，强化项目教学能够确保有效落实校企共教，确保学生能够更充分地掌握相关专业知识，强化学生实践技能，保证学生在未来能够更高效地参与职业工作。
参考文献：
［1］江梅梅.项目式教学在网页设计与制作课程中的应用［J］.大观，20xx，229（11）：151-152.
［2］朱晓.优化网页制作与设计课程课堂教学的几点做法［J］.现代职业教育，20xx（6）：188-189.
［3］蔡鸿璋.探索网页设计与制作课程教学的新思路［J］.课程教育研究，20xx（42）：55.
［4］梁菊.项目教学法运用于中职电子商务网页设计与制作教学中的探究［J］.职业，20xx，501（2）：73-74.
网页意义与设计制作 第3篇
摘要：DIV+CSS是Web设计标准，随着标准化设计理念的普及，国内很多大型站采用DIV+CSS网页布局制作方法。从实际应用情况证明，该技术具有代码简洁、表现和内容相分离等优势。
关键词：设计论文
1、DIV+CSS概念
DIV就是一个区块容器，用来封闭数据区域，属于行级区域，相当于一个可以容纳表格、段落、标题、图片等各种元素的容器。在进行网页布局排版时，需要将页面整体上进行DIV分块。层叠样式表CSS示国际W3C标准化组织制定的一套完整的扩展样式标准，主要是为了在HTML的样式编排上对其功能进行补充，更好地完成网页设计的需要而制定的设计标准。CSS层叠样式表对HTML的标记属性的设定进行了扩充，可以使用Script程序功能来对其进行很好的控制，从而对网络的外观设计和整体的布局设计进行非常有效的控制，让网页在设计上具有更加美观的表现形式。CSS层叠样式表技术可以把网页本身需要展示的内容和网页本身具有的样式进行有效的分开，从网页设计的内容中把网页的外观在设计时候设计的信息进行独立存储，进而对网页进行集中有效的统一管理。我们在网页设计的时候把CSS样式的信息作为独立的文件进行存放，可以方便地让其他的网页对其信息进行共享，这样在网页设计的时候就不需要对网页中的文件进行重复性的操作设计了，节省了很多时间和不变要的设计工作。在网页设计中CSS类型的文件建立完之后可以被其他的HTML文件进行共享使用，并且一个单一的HTML文件也可以对其他相关的CSS类型的文件进行套用，这样在网也设计的时候可以很方便地对网页的文件和功能进行设计。
的定义
CSS语法定义包括3个部分，格式如下：Select(propervalue)选择(属性：值)：在属性中可以为设计的网页进行主体的设计，prop-er可以选择要设计的主体，value可以设定主体的属性，这样就可以为网页中的主体的表现效果进行设置了。
选择符类型
(1)标记选择器标记选择器就是声明某个标记直接采用某个样式。如通过h1选择器声明页面中所有的
标记的文字效果。
(2)类别选择器类别选择器的定义通常在最前面加一个点号。类别选择符的名字可以由设计者按照自己的意愿来进行定义，对名字的定义可以使英文或者数字，也可以是英文和数据的混合，在进行命名的时候都是以功能来进行名字的设置的。
(3)ID选择器在网页设计的HTML的页面中，网页页面元素的指定都是以ID参数进行表示的，ID参数的选取符可以对单个元素的样式进行单独的表示，ID选取符在应用方面比较与类选择符相类似，只要把ID代替CLASS就可以了，一般只在非常特殊的或者特定的环境下才使用ID参数，在选择符中ID参数的使用也仅仅是对单个元素的样式进行独立的表示。
2、使用DIV+CSS
采用CSS+DIV技术对网页进行设计具有以下几方面的优点：
内容和形式分离
在独立样式表示的文件中把外观设计从中独立出来进行存放，HTML文件中的内容只能对文本信息进行存放，这样网页前台只需要显示内容就行，形式上的美工交给CSS来处理。内容和形式相分离，生成的HTML文件代码更加精简、更小，网页打开速度更快。
提高搜索引擎对网页的索引效率
采用DIV+CSS架构的网站更符合W3C标准，网站设计要以W3C为指定的标准，这是搜索引擎中关于网页名次排列的一个重要决定标准。网页设计的源代码使用简洁的源代码，采用结构化内容的HTML来取代嵌套的标签文件，网页的内容信息在蜘蛛搜索引擎上处于裸露状态，这样搜索引擎可以更好地对网页内容进行有效的搜索，关键性的内容很容易被得到，对关键性页面的内容在网页中的比重增加了，这样网页的搜索排名比重也增加了，网页的公众评价也可以得到很大的提高。
网站页面浏览速度的提高
网站页面的视觉效果如果是同样的，那么DIV+CSS建立的网页页面的大小与TABLE编码设计的网页的页面的大小相比要小，一般是1/2大小。采用CSS进行设计后，用户在使用网站页面的时候最大的效果就是对网页进行浏览的时候启用页面的速度明显变快。
易于维护和改版
网站设计采用DIV+CSS技术进行设计，在以后的日常维护工作方面会变得很方便。在维护的时候只需要对CSS文件进行修改和设计就可以完成对网页的维护了。在传统的网页布局的表格布局中，对布局的修改是非常麻烦的，是要对整个网也来进行重新设计的。在网页设计的时候如果可以有效地对网页的层结构进行设计，在对网页的外观进行修改的时候只需要使用CSS技术进行对网页结构和内同进行修改就可以了。网页结构的修改和重新设计可以提高蜘蛛搜索引擎的关注度。
3、CSS的使用
外部样式表
外部样式表是一种文件，在网页中外部样式表的存在可以以独立的形式，外部样式表文件可以在多个网页页面中进行使用，外部样式表示一种样式文件通过样式来对文件进行保存的，在网页页面中通过link标记与其他的样式表文件进行连接，文件扩展名是.CSS。link标记在页面设计的时候是在head区域进行存放的。浏览器通过文档形式从CSS文件中把定义的样式表读取出来，对网页页面设计中使用的外部表的样式和文件类都进行了定义。在多个网页页面中可以应用统一个外部样式表的文件，在网页设计的时候如果对样式表文件进行了修改，那么网页页面的其他的样式也会发生变化。在网页设计的时候对大量的同样的样式页面进行制作还是非常方便的，网页页面设计的重复性工作减少了，在以后网站页面的维护和修改上也比较方便，在对页面浏览的时候关于重复代码的下载也减少了。
内部样式表
内部样式表的设计是在页面的和的标签之间加入样式表，这样在网页页面中就把定义好的样式应用进来了，样式表的插入是以style标签的形式插入的，例：这种样式的使用相对来说还是比较简单，而且在应用上还是比较实用的，在网页页面的头部可以输入同样的样式，这样所有的网页页面的样式就都统一化了。
内联样式表设计
在HTML标记中对内联样式的使用属于混合样式，通过这样的方式，对元素进行样式的单独定义就比较简单了，在HTML标记里直接加入style参数这是使用内联样式的基本方式，CSS属性和style参数的内容是一样的。在实际上，内联样式表的效率与以上两种情况相比来说在效率上还是比较低的，在网页的页面设计中对内联样式表的使用是不推荐的。内联样式表不能重复使用里面的样式内容，另外内联样式表的标记的内容和样式都是混合在一起使用的，对代码的维护具有很大的难度，而且在代码进行阅读的时候也是比较复杂的。
4、制作流程
(1)创建文件(文件管理及命名)。
(2)与HTML文档建立关系。网站常用：外链样式。
(3)制作页面样式。要为每一个DIV进行边界的设置，这样可以清晰地看到里面的内容，就不需要通过屏幕卷动的方式进行浏览了。对元素进行定义编写CSS等，选择符采用递归结构。在网页设计的时候设置的标记就更加清晰了。同HTML框架一致从上到下，从整体到局部，共用样式到个别样式。CSS文档的顺序：共用的代码样式放在文档最前面。CSS结构设计的顺序一般都是以HTML的顺序为标准的。CSS选择器中的相关的属性的顺序表示：属性显示->自身属性->文本属性。显示属性：display,list-style,position,float,clear。自身属性：width,height,margin,padding。文本属性：color,font,text-decoration,text-align,ver-tical-align,white-space,content。原因：以上的顺序是我们在进行项目开发的时候使用的代码的标准，这个顺序设浏览器的渲染顺序是一致的，最终的目的是为了把执行效率进一步地提高。
(4)注释添加：
1)文档与对应的文档注释的关系是唯一的关系，这也是为了便于今后对网页的维护，注释的说明表示主要是：创建文档人和时间等信息的说明。
2)属性注释说明。
3)功能注释说明。DIV+CSS技术在网页布局的设计上是主流技术，DIV+CSS技术符合国家W3C的一系列标准，并且可以使用DIV+CSS技术对网站的重构，可以大大提升网站浏览速度，易于维护和改版，提升网站用户与搜索引擎的友好度。
参考文献
[1]车元媛.CSS技术在网页设计中的应用研究.科技信息,20xx.
[2]王聪.基于DIV+CSS技术网页布局应用与实践.电脑知识与技术：学术交流,20xx.
[3]石元聆.DIV+CSS技术网页布局中定位技术的探讨.电脑编程技巧与维护,20xx.
[4]田佳妮.DIV+CSS在网页布局中的应用研究.电脑知识与技术,20xx.