长春大学 20 15 —2016学年第二学期Web前端开发技术课程 实验报告 学院：计算机科学技术专业：软件工程 班级：软件15402
学号：041440210 姓名：王悦 任课教师：车娜 实验三 CSS网页布局 一、实验目的 1.掌握CSS盒子模型的概念，能够灵活运用盒子模型布局页面； 2.掌握盒子模型相关属性，能够使用它们熟练地控制网页元素； 3.理解块元素与行内元素的区别，能够对它们进行转换。 二、内容及要求 运用盒子模型的相关属性实现网页弹出框效果，满足如下要求： 1.网页弹出框由上面的标题和下面的宣传内容两部分组成； 2.标题通过h2定义； 3.在段落文本中内容部分由h3和p标记进行定义； 4.应用
网站设计如果单靠一个一个代码码出来效率就过于低下了，如果利用网上的一些资源，只需简单的几个步骤你就可创建出更具吸引力的设计，包括菜单、背景、动画、眉头、body等设计。响应式Web设计不仅能够适用于任何屏幕尺寸，还为用户带来更完美的体验，本文将分享十款最佳的响应式Web设计开发框架，助你大大提高工作效率。 Gumby Framework
Gumby 2是建立在Sass基础上的。Sass是一款非常强大的CSS 预处理器，允许用户自主快速的开发扩展Gumby，同时提供很多新的工具来自定义和扩展Gumby框架。Gumby 2是一个非常棒的响应式CSS框架。 Get UI Kit Get UI Kit是一款轻量级、模块化的前端框架，用于开发快四且强大的 Web界面。 Foundation
Foundation是一个易用、强大而且灵活的框架，用于构建基于任何设备上的Web应用。提供多种Web上的UI 组件，如表单、按钮、标签等。 Semantic
UI是Web的灵魂！Semantic是为攻城师而制作的可复用的开源前端框架。 提供各种UI组件，使得开发更加直观、易于理解。 52Framework
52 Framework主要用于优化HTML5和CSS3的跨浏览器兼容性的框架， 可在所有主流浏览器上运行。 PureCSS
Pure是一组小的、响应式CSS模块，可用于任意Web项目中。它可作为每个网站或Web应用的起步工具，帮助开发者处理应用程序所需的所有CSS工作，同时不会让每个应用千篇一律。 Responsablecss
9款流行Web框架及其优缺点 对于 Web 开发人员来说，找到一些合适的工具，能让工作轻松许多。这其中，Web 框架更是提升工作效率的“利器”。但因为可选的 Web 框架非常多，如何选择也是一件令人头疼的事情。 作者：王练来源：开源中国社区|2016-12-06 09:45 收藏 分享 对于 Web 开发人员来说，找到一些合适的工具，能让工作轻松许多。这其中，Web 框架更是提升工作效率的“利器”。但因为可选的 Web 框架非常多，如何选择也是一件令人头疼的事情。 本文列出了9款目前比较流行的 Web 框架，并对优缺点进行分析，希望能对大家有所帮助。（内容主要编译自Ken Mazaika的The 9 Most In-Demand Web Frameworks And What You Need To Know About Them） 首先， 什么是 Web 框架 当 Web 浏览器使用 HTTP 和在其他地方运行的服务器（计算机）通讯时，这些服务器会收到一些通知： 所选的 URL 如何输入网址（通过表单提交或只是在浏览器栏中输入网址） 服务器要干很多事情，比如： 读取数据库里的数据和添加数据 找到正确的结果（用户是否被允许查看试图访问的页面是否要发送到不同的URL等等） 构建用户将看到的网页
如果要提供更复杂的功能，就需要执行更多的步骤。作为开发人员，则需要对想要的功能列出一系列解决方案。Web 框架就是其中可选的解决方案之一。 进入正题： 1、Ruby on Rails 编程语言：Ruby 简介： Ruby on Rails 是一个已经被许多公司采用的 Web 框架，是 Ruby 编程语言中Web 框架的鼻祖，获得了大量开发者的采用。DHH（Rails 的创始人）曾用它15分钟左右创建一个博客。
概述 开发框架的选择，始终是个仁者见仁、智者见智的事情。尤其是Web层的开发框架，数量非常多，而且各有特色，如：Struts、WebWork、Spring MVC、Tapestry、JSF、WebPage3.0......等等。他们各自的优、缺点： 框架使用背景 一：使用框架的必然性 框架，即framework。其实就是某种应用的半成品，把不同应用程序中有共性的一些东西抽取出来，做成一个半成品程序，这样的半成品就是所谓的程序框架。 软件系统发展到今天已经很复杂了，特别是服务器端软件，涉及到的知识，内容，问题太多。在某些方面使用别人成熟的框架，就相当于让别人帮你完成一些基础工作，你只需要集中精力完成系统的业务逻辑设计。这样每次开发就不用白手起家，而是可以在这个基础上开始搭建。 使用框架的最大好处：减少重复开发工作量、缩短开发时间、降低开发成本。同时还有其它的好处，如：使程序设计更合理、程序运行更稳定等。基于这些原因，基本上现在在开发中，都会选用某些合适的开发框架，来帮助快速高效的开发应用系统。 了解了使用框架的必然性，下面来看看如何选择，当然我们的话题集中在Web层的开发框架。在谈这个问题之前，先来看看我们在Web开发中究竟需要做些什么工作： 二：Web层开发的工作 在J2EE开发中，分层是基本的思想，3层架构或者多层架构早已深入人心，在这里我们就把目光集中到Web层，看看到底Web层开发做了那些工作： 1：数据展示 Web层需要从逻辑层获取需要展示的数据，然后以合理的方式在页面进行展示 2：人机交互 用户需要从界面上输入数据，在界面上进行按钮点击，进而触发事件，标准的事件驱动模型，然后跟后台进行数据交换，出现新的界面。 3：收集数据，调用逻辑层接口 Web层收到用户的事件请求，需要调用相应的逻辑层接口来进行处理，Web层是不会有任何逻辑处理的。调用逻辑层接口，需要传递参数，这时需要收集用户在界面上输入的数据，然后进行组织，组织成为逻辑层接口需要的数据封装形式（通常都是ValueObject）。 4：根据逻辑层的数据来重新展示页面 逻辑层处理完了，需要返回数据或信息到界面上。这个时候Web层需要根据返回的值选择合适的页面，然后展示这些数据或者信息。 从上面可以看出，Web层开发的主要工作集中在展示上，也就是图形用户界面。这一部分是用户直观感受应用程序的窗口，也是用户要求最多的地方，其表现形式也是最丰富的。 三：Web层开发的步骤 下面再来总结一下Web层开发的大致步骤（也就是需要开发人员做的工作）： 注意：这里讨论的Web层开发，是不使用任何开发框架时候的开发。 1：写页面Html，到底有哪些数据需要在界面上表现
总分100分考试时间：120分钟考试形式：闭卷、选择题(每题1分，共20 分) 1. HTMLI旨的是___________ (A)超链接的文本标记语言(B) 超文本标识语言 (C)家庭工具标记语言(D) 以上都不是 2. 下列能够实现美化页面的语言是。 (A) HTML (B) CSS (C) VFP (D) JavaScript 3. 以下标记中用于设置内部样式表的标记的是。 (A)