文章图片标题

第一个html5程序

分类:html 作者:千影 评论:0 点击: 668 次 日期:2015-07-23


HTML 5实战HTML 5中不仅增加了很多新的页面标记,而且与HTML 4相比,整体页面的结构也发生了根本的变化。下面使用HTML 5新结构来编写一个简单的页面。
实例1-2 Hello, World页面的实现
1. 功能说明
使用HTML 5结构编写一个HTML页面,在页面中输出“Hello, World”的字样。
2. 实现代码
在Dreamweaver CS5中新建一个HTML页面1-2.html,加入代码如代码清单1-2所示。代码清单1-2 我的第一个HTML 5页面


我的第一个HTML 5 页面

Hello,World

3. 页面效果
该页面在Chrome浏览器下执行后的页面效果如图1-3所示。
图1-3 Hello, World页面实现效果
4. 源码分析
通过短短几行代码就完成了一个页面的开发,这充分说明了HTML 5语法的简洁;同时,HTML 5不是一种XML语言,其语法也很随意,下面从这两方面进行逐句分析。
第一行代码如下:

短短几个字符,甚至不包括版本号,就能告诉浏览器需要一个doctype来触发标准模式,可谓简明扼要。接下来,我们需要说明文档的字符编码,否则将出现浏览器不能正确解析,导致安全隐患的后果,为此我们加入如下一行代码:

同样也是几个字符,便说明了该文档的字符编码;同时,HTML 5不区分字母大小写、标记结束符及属性是否加引号,即下列代码是等效的:



在主体中,可以省略与标记,直接编写需要显示的内容,代码如下:

Hello,World

虽然我们在编写代码时省略了与标记,但在浏览器进行解析时,将会自动进行添加,如图1-4所示。
图1-4 自动添加与标记后的源文件
因此,考虑到代码的可维护性,我们在编写代码时,尽量增加这些在HTML 5中可选的元素,从而实现页面代码最大限度的简洁与完整。




声明: 除非注明,本文属( 千影 )原创,转载请保留链接: http://www.tomrrow.com/archives-2792.html