HTML5与CSS3web前端开发技术习题答案.docx

上传人:h**** 文档编号:769001 上传时间:2018-10-31 格式:DOCX 页数:61 大小:1.42MB
下载 相关 举报
HTML5与CSS3web前端开发技术习题答案.docx_第1页
第1页 / 共61页
HTML5与CSS3web前端开发技术习题答案.docx_第2页
第2页 / 共61页
HTML5与CSS3web前端开发技术习题答案.docx_第3页
第3页 / 共61页
HTML5与CSS3web前端开发技术习题答案.docx_第4页
第4页 / 共61页
HTML5与CSS3web前端开发技术习题答案.docx_第5页
第5页 / 共61页
点击查看更多>>
资源描述

1、第一章1简答题(1)在 Web 前端开发方面,HTML5 与 HTML4 比较,主要解决哪几方面的问题?HTML5 的核心在于解决当前 Web 开发中存在的各种问题。一是解决 Web 浏览器之间的兼容性问题。在一个浏览器上正常显示的网页(或运行的 Web应用程序) ,很可能在另一个浏览器上不能显示或显示效果不一致;二是文档结构描述的问题。HTML4 之前的各版本中,HTML 文档的结构一般用 div 元素描述,文档元素的结构含义不够清晰;三是使用 HTML+CSS+JavaScript 开发 Web 应用程序时,开发功能受到很大的限制,比如本地数据存储功能、多线程访问、获取地理位置信息等,这些

2、都影响了用户的体验。(2)HTML5 新增的全局属性有哪几个?描述其主要功能。HTML5 新增的全局属性,是指可以对任何元素都使用的属性。功能如下所示。属性 描述 HTML5 新增accesskey 规定访问元素的键盘快捷键class 规定元素的类名(用于规定样式表中的类)。contenteditable 规定是否允许用户编辑内容。 是contextmenu 规定元素的上下文菜单。 是dir 规定元素中内容的文本方向。draggable 规定是否允许用户拖动元素。 是dropzone 规定当被拖动的项目/数据被拖放到元素中时会发生什么。 是hidden 规定该元素是无关的。被隐藏的元素不会显示

3、。 是id 规定元素的唯一 ID。lang 规定元素中内容的语言代码。spellcheck 规定是否必须对元素进行拼写或语法检查。 是style 规定元素的行内样式。tabindex 规定元素的 tab 键控制次序。title 规定有关元素的额外信息。(3)HTML5 是下一代 Web 语言的开发框架,典型特性有哪些?HTML5 从标记语言的功能提升到下一代 Web 语言的开发框架,他集成了HTML+CSS3+JavaScript 的 Web 应用框架。 。良好的语义特性。HTML5 支持微数据与微格式,增加的各种元素赋予 网页更好的意义和结构,适于构建对程序、对用户都更有价值的数据驱动的 W

4、eb 应用。HTML5 增加了 section 元素、article 元素、 nav 元素以及 aside 元素等结构元素。强大的绘图功能。通过使用 Canvas API 动态地绘制各种效果精美的图形,也可以通过SVG 绘制可伸缩矢量图形。增强的音视频播放和控制功能。新增了 audio 和 video 元素,可以不依赖任何插件而播放音频和视频。HTML5 的数据存储和数据处理的功能。包括离线应用、Web 通信、本地存储 等功能,HTML5 还支持 WebSQL 和 IndexedDB 等轻量级数据库,增强了数据存储和数据检索能力。获取地理位置信息。HTML5 新增了 Geolocation A

5、PI 规范,应用于移动设备中的地理定位。提高页面响应的多线程。HTML5 新增了 Web Workers 来实现多线程功能。通过 Web Workers,将耗时较长的处理交给后台线程,降低 Web 服务的响应时间,有利于增强用户体验。方便用户处理文件和访问文件系统的文件文件 API 。HTML5 的文件 API 包括 FileReader API 和 File SystemAPI。除了上面介绍的 HTML5 的特性之外,HTML5 还有管理浏览器历史记录的 History API。HTML5 可以通过脚本语言在浏览器历史记录中添加项目,以及在不刷新页面的前提下显示地改变浏览器地址栏中的 URL

6、 地址;而 HTML5 的拖放功能可以使用mousedown、mousemove、mouseup 等方法来实现拖放操作。(4)HTML5 文档结构的 HTML4 之前的文档结构有哪些变化?内容类型(ContentType) 。HTML5 的文件扩展名与内容类型与之前的 HTML 版本相同。但.DOCTYPE 声明 做了简化,该声明适用所有 HTML。声明如下: 在 HTML5 中,直接指定 meta 标记的 charset 属性可以设置字符编码,如下所示。 从 HTML5 开始,对于 HTML 文件的字符编码推荐使用 UTF-8。操作题略。第二章1简答题(1)简述 HTML 文档的基本结构元素

7、的功能。HTML 文档的基本结构元素包括、等。和标记表示该文档是 HTML 文档。有时 标记可省略,因为.html 或.htm 文件被 Web 浏览器默认为是 HTML 文档。和标记表示的是文档头部信息,一般包括标题和主题信息,该部分信息不会显示在页面正文中。一些 CSS 样式定义、JavaScript 脚本也可以放到文档的头部。和标记是网页的主体信息,是显示在页面上的内容,各种网页元素,包括文字、表格和图片等信息都将放到这个标记内。如果为 body 元素设置 CSS 样式,还可以实现背景、边距、字体等样式的变化。(2)HTML5 增加的 article、section、nav、aside 等

8、结构元素功能。HTML 5 增加了 article、section、nav 、aside、header 、footer 等布局元素,以实现更好的语义解释。但这些结构元素定义的是增强了语义的 div 块,是 HTML 页面按逻辑进行分割后的单位,并没有显示效果article 元素代表文档、页面或应用程序中独立的、完整的、可以独自被外部引用的内容。 例如,一篇博客或报刊中的文章、一篇论坛帖子、一段用户评论或独立的插件等。section 元素用于定义文档中的节。比如章节、页眉、页脚或文档中的其它部分。一般用于成节的内容,会在文档流中开始一个新的节。nav 元素是一个可以用作页面导航的链接组,其中的导

9、航元素链接到其他页面或当前页面的其他部分。aside 标签用来承载非正文的内容,被视为页面里面一个单独的部分。它包含的内容与页面的主要内容是分开的,可以被删除,而不会影响到网页的内容、章节或是页面所要传达的信息。header 元素是一种具有引导和导航作用的结构元素,通常用来放置整个页面或页面内的一个内容区域的标题,但也可以包括表格、logo 图片等内容。footer 元素一般作为其上层容器元素的脚注(3)HTML 为什么要使用字符实体?列举出 5 个常用的字符实体名称。一些字符在 HTML 中拥有特殊的含义,比如小于号 ( 大于号 “ 引号 撇号 (IE 不支持) 节 版权 注册商标 乘号 除

10、号 操作题略。第三章1简答题(1)定义列表的标记有哪几种?各种列表标记之间都可以嵌套使用吗?HTML 中的列表元素有 3 种形式 有序列表、无序列表和自定义列表。有序列表由标记对实现,在标记之间使用成对的标记添加列表项目。无序列表由成对的标记对实现,标记之间使用成对的标记可添加列表项目。自定义列表以标记开始,自定义列表项目以开始,自定义列表的解释以开始。各种列表标记之间都可以嵌套使用,例如,自定义列表的一个嵌 套。自定义列表示例用户名618 个字符,需以字母开头 first Namefdsdffddsfds last Namefdfdfdsdsssdf密码616 个字符,区分大小写 (2)在

11、HTML 文档中插入图像使用什么标记?该标记有哪些常用属性?分别实现什么功能?使用标记插入图像,语法格式如下。该标记含有多个属性,具体的属性及功能如表所示。其中,width 属性、height 属性、border 属性、align 属性已经不建议使用,而是通过 CSS 来描述。属性名 说明src 图像地址title 添加图像的替代文字width/height 设置图像宽度/高度border 设置图像边框align 设置图像对齐方式(3)绝对路径、相对路径和根路径的区别是什么?绝对路径指文件的完整路径,包括文件传输的协议 HTTP、FTP 等,一般用于网站的外部链接,相对路径是指相对于当前文件的

12、路径,它包含了从当前文件指向目的文件的路径,适用于网站的内部链接。根路径的设置以“/”开头,后面紧跟文件路径,例如:/download/index.html。根路径的设置也适用于内部链接的建立,一般情况下不使用根路径。根路径必须在配置好的服务器环境中才能使用。(4)如何为网页添加超链接?定义超链接时如何指定打开链接文件的目标窗口?有几种目标窗口形式?在 HTML 文件中,使用标记来定义超链接,具体链接对象通过标记中的 href 属性来设置。定义超链接的语法格式如下。 链接标题target 属性指定用于打开链接的目标窗口,默认方式是原窗口,其属性值如表所示。属性值 说明parent 当前窗口的上

13、级窗口,一般在框架中使用blank 在新窗口中打开self 在同一窗口中打开,和默认值一致top 在浏览器的整个窗口中打开,忽略任何框架2操作题(1)使用无序列表标记和有序列表标记定义如图 3-23 所示的嵌套列表,链接文件可自定义或输入“#”。嵌套列表示例学生选课信息必修课公共必修课计算机基础大学外语专业必修课选修课公共选修课专业选修课图 3-23 嵌套列表效果(2)在网页中插入图像,并对图像做如下设置。图像宽为浏览器窗口的一半,高为浏览器窗口的 1/4;图像边框宽 5 像素;替代文字为“图片欣赏” ;图像显示在文字左侧。(3)使用表格及表格嵌套技术等,对网页做如图 2-43 所示的布局设计

14、。 表格宽度为 600 像素; 可以先后插入 4 个 22 的表格,将每个表格第一行第一个单元格设置为跨 2 竖列,也可以根据图示,自定义表格结构; 标题单元格的背景颜色可自定义。 图 3-24 表格示例第四章1简答题(1)表单中文本框和密码框在定义方法和实现效果上有什么区别?将标记中的 type 属性值设置为 text,就可以在表单中插入文本框。在此文本框中可以输入任何类型的数据,但输入的数据将以单行显示,不会换行。例如,使用标记输入姓名的代码如下。姓名:其中,name 属性用于定义文本框的名称。maxlength 和 size 属性用于指定文本框的宽度和允许用户输入最大的字符数,更多情况下

15、,采用 CSS 设置。value 指定文本框的默认值。将标记中的 type 属性值设置为 password,就可以在表单中插入密码框,涉及到各属性的含义与文本框相同。在此密码框中可以输入任何类型的数据,这些数据都将以实心圆点的形式显示,以保护密码的安全,例如:密码:(2)在表单中定义一组单选按钮和一组复选按钮在方法上有什么区别?复选框允许在一组选项中选择任意多个选项。将标记中的 type 属性值设置为checkbox,就可以在表单中插入复选框。通过复选框,用户可以在网页中实现多项选择。例如,请选择:其中,value 属性指定的复选框被选中是该控件的值,checked 用来设置复选框默认被选中。

16、单选按钮表示互相排斥的选项。在某单选按钮组(由两个或多个同名的按钮组成)中选择一个按钮时,就会取消对该组中其他所有按钮的选择。将标记中的 type 属性值设置为radio,就可以在表单中插入一个单选按钮。在选中状态时,按钮中心会有一个实心圆点。(3)简述 HTML5 新增加的 form 属性、formmethod 属性、placeholder 属性、autocomplete 属性的功能。在 HTML5 中,可以将表单元素写在页面上的任何位置,然后给该元素指定一个 form 属性,属性值为该表单的 id(id 是表单的惟一属性标识) ,通过这种方式声明该元素属于哪个具体的表单。HTML5 中使用

17、 formmethod 属性对每个表单元素分别指定不同的提交方法。placeholder 是指当文本框处于未输入状态时文本框中显示的输入提示。例如:autocomplete 属性 是辅助输入的自动完成功能,其值为“on”“off”与“”三类值。不指定时,使用浏览器的默认值(取决于各浏览器的设定) 。该属性设置为 on 时,可以显式指定待输入的数据列表。如果使用 datalist 元素与 list 属性提供待输入的数据列表,自动完成时,可以将该 datalist 元素中的数据作为待输入的数据在文本框中自动显示。(4)HTML5 中 input 标记的 type 属性增加的类型包括 number、range 、date、time 等,说明其功能。将 input 标记中的 type 属性设置为 number,可以在表单中插入数值输入域,还可以限定输入数字的范围。将 input 标记中的 type 属性设置为 range,可以在表单中插入表示数值范围的滑动条,还可以限定可接受数值的范围。只要将 input 标记中的 type 属性设置为 date、time,可以完成网页中日期选择器的定义。

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 教育教学资料库 > 参考答案

Copyright © 2018-2021 Wenke99.com All rights reserved

工信部备案号浙ICP备20026746号-2  

公安局备案号:浙公网安备33038302330469号

本站为C2C交文档易平台,即用户上传的文档直接卖给下载用户,本站只是网络服务中间平台,所有原创文档下载所得归上传人所有,若您发现上传作品侵犯了您的权利,请立刻联系网站客服并提供证据,平台将在3个工作日内予以改正。