【HTML 5的革新:结构之美】

前言 HTML
5如同一场革命,正在Web2.0后时代轰轰烈烈的进行着。 HTML 5是什么,无须我在这里赘述了。对于HTML 5的革新,按我的理解,可以总结为语义明确的标签体系、化繁为简的富媒体支持、神奇的本地数据存储技术、不需要插件的富动画(canvas)、强大的API支持。总之,HTML 5让人机交互,人网交互变得更加舒适,贴合用户。以往对富媒体应用与本存储的支持乏力也不再是浏览器的切肤之痛。将Web从内容平台推向标准化的应用平台,并一统各在平台阵营的标准,才是HTML 5革命的初衷。 本文,我就抛砖引玉,阐述HTML
5的革新之一:语义更明确简洁的结构。 从"头"说起 一个标准的XHTML头部代码应该是这样:

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  5. </head>

复制代码

 你能记住吗?你会去死记硬背吗?当然不会!我们只需要机械的复制粘贴即可。 再看看一个标准的HTML 5头部是如何的:

阅读全文

时间: 2024-07-31 08:53:05

【HTML 5的革新:结构之美】的相关文章

Java的结构之美【2】——销毁对象

先来看一段代码: import java.util.Arrays; import java.util.EmptyStackException; /** * 2014年6月28日09:31:59 * @author 阳光小强 * */ public class Stack { private Object[] elements; private int size = 0; private static final int DEFAULT_INITAL_CAPACITY = 15; public S

HTML5 结构之美(2) - 新增的非主体结构标签

接上文<HTML5 结构之美(1) - 新增的主体结构标签>,HTML5 还新增了一些表示逻辑结构或附加信息的非主体结构标签. header标签 header 标签是一种具有引导和导航作用的结构标签,通常用来放置整个页面或页面内的一个内容区块的标题,但也可以包含其他内容,例如数据表格.搜索表单或相关的 logo 图片. 很明显,整个页面的标题应该放在页面的开头,我们可以用如下所示的形式书写页面的标题: <header><h1>页面标题</h1></he

结构之美——优先队列基本结构(四)——二叉堆、d堆、左式堆、斜堆

实现优先队列结构主要是通过堆完成,主要有:二叉堆.d堆.左式堆.斜堆.二项堆.斐波那契堆.pairing 堆等. 1. 二叉堆 1.1. 定义 完全二叉树,根最小. 存储时使用层序. 1.2. 操作 (1). insert(上滤) 插入末尾 26,不断向上比较,大于26则交换位置,小于则停止. (2). deleteMin(下滤) 提取末尾元素,放在堆顶,不断下滤: (3). 其他操作: 都是基于insert(上滤)与deleteMin(下滤)的操作. 减小元素:减小节点的值,上滤调整堆. 增大

Java的结构之美【1】——构造对象

当我们遇到多个构造器参数的时候可能会想到用构件器,代码如下: /** * 构建器 * @author 阳光小强 * */ public class Lunch { private String cake; private String meat; private String milk; private String drink; public Lunch(){ this(null); } public Lunch(String meat){ this(null, meat, null); }

HTML 5的革新:结构之美

前言HTML 5如同一场革命,正在Web2.0后时代轰轰烈烈的进行着.HTML 5是什么,无须我在这里赘述了.对于HTML 5的革新,按我的理解,可以总结为语义明确的标签体系.化繁为简的富媒体支持.神奇的本地数据存储技术.不需要插件的富动画(canvas).强大的API支持.总之,HTML 5让人机交互,人网交互变得更加舒适,贴合用户.以往对富媒体应用与本存储的支持乏力也不再是浏览器的切肤之痛.将Web从内容平台推向标准化的应用平台,并一统各在平台阵营的标准,才是HTML 5革命的初衷. 本文,

HTML5 结构之美(1) - 新增的主体结构标签

article标签 article 标签代表文档或页面中独立的.完整的.可以独自被外部引用的内容.它可以是一篇博客或报刊中的文章.一篇论坛帖子.一段用户评论或独立的插件,或其他任何独立的内容. 除了内容之外,一个 article 标签通常有它自己的标题(一般放在一个 header 标签里面),有时还有自己的脚注. 现在,让我们以博客为例来看一段关于 article 标签的代码示例: <article> <header> <h1>苹果</h1> <p&g

HTML5 结构之美(3) - 结构标签综合运用

前面我们介绍了在 HTML5 中新增的结构标签,以及这些标签的定义和使用方法.接下来,让我们看一下在 HTML5 中进行总体页面布局的时候,具体应该怎样来综合运用这些结构标签. 大纲 通过使用新的结构标签,HTML5 的文档结构比大量使用 div 标签的 HTML4 的文档结构要清晰.明确了很多.如果再规划好文档结构的大纲,就可以创建出对阅读者或屏幕阅读程序来说,都很清晰易读的文档结构. 所谓大纲,简单来说就是文档中各内容区块的结构编排.内容区块可以使用标题标签(h1~h6)来展示各级内容区块的

js实现简单的滑动门和tab选项卡

思想:首先定义三个选项卡,可以用任何标签,只要如下图, 一共有三个ul,第一个ul给一个class,因为默认第一个选项卡的内容显示出来, 其他两个ul  display:none: 当我鼠标移到第二个第三个选项卡的时候,删除第一个选项卡的class,鼠标移到哪里就给哪个选项卡那个class 思路就這样 下面是完全的代码 最好自己写写,然后参考自己下面的代码 <!DOCTYPE html> <html> <head> <meta charset="utf-

sqlmap 的源码学习笔记一之目录结构

0x00 前言 sqlmap 是一个开源的渗透测试工具,可以用来自动化的检测,利用SQL注入漏洞,获取数据库服务器的权限.它具有功能强大的检测引擎,针对各种不同类型数据库的渗透测试的功能选项,包括获取数据库中存储的数据,访问操作系统文件甚至可以通过外带数据连接的方式执行操作系统命令.本文重点研究sqlmap的软件具体的目录结构,后续的文章也会从源码编写中,阐述sqlmap的种种编码结果.本文从结构中,可以看到sqlmap中的软件工程之美,同时从严谨的软件结构目录分类和构造中,看到sqlmap中的