cuyi7076
cuyi7076

html5和css3_使用HTML5和CSS3创建现代网站

html5和css3

在你开始前

本教程假定您具有HTML，CSS和JavaScript的一些基本经验。 它假定您了解HTML元素或标记是什么，属性的含义，HTML标记的基本语法，网页的一般结构，等等。 就CSS而言，您应该熟悉基于元素，类和基于ID的选择器，CSS属性的语法以及如何使用内联或外部样式表将CSS包括在Web页面中。 最后，假定您具有一些JavaScript的使用知识，例如什么是变量，函数，if语句和for循环，以及如何在网页中包含JavaScript代码。 如果你觉得你需要刷上了这些技术开始之前，直接跳到了相关主题的一些有用的教程和文章，将带给你加快速度HTML，CSS的基础知识部分，和JavaScript开发。

关于本教程

在过去十年左右的时间里，诸如Web 2.0，富Internet应用程序（RIA）和语义Web之类的概念都将HTML，CSS和JavaScript推向了极限，甚至超出了它们的极限，它们通常依赖于Adobe®之类的插件。闪存可为视频和音频等组件以及高度图形化和交互式的应用程序供电。 Adobe Flex开发框架，Microsoft®的Silverlight平台和JavaFX都希望在HTML的弱点使开发人员的生活陷入困境时提供支持。 但是，使用HTML5时，标记语言开始大行其道，提供全面的多媒体支持，本地存储和脱机应用程序支持，本机2D绘图API和许多新的应用程序开发API，所有这些都旨在证明HTML，CSS ，JavaScript可以为您的网站和应用程序提供丰富的前端。

HTML5被广泛认为是计划于2010年出现的最重要的新技术之一，并且已经有数本关于该主题的书正在撰写，其中一些书预定于今年3月出版。 多年来，Web一直依靠外部插件来提供Web浏览器本身无法支持的功能，尤其是在2D绘图，动画和多媒体方面。 HTML和CSS规范的最新版本旨在消除对这些附加浏览器组件的需求，以简化此类功能，并减少此类琐碎事情所需JavaScript数量（或在某些情况下完全消除对JavaScript的需求）行拖放，行条纹等等。 遵循本教程，以学习如何利用HTML5。

先决条件

HTML5是一个相对较年轻的规范，因此，对浏览器的支持非常有限（在撰写本文时）。 本教程中介绍的代码旨在尽可能与跨浏览器兼容，但是某些功能并非在所有浏览器中都可用。 本教程中将明确标识当前特定于浏览器的所有功能。 为确保您可以体验所有这些新功能，建议在开发HTML5和CSS3应用程序时在系统上安装以下Web浏览器的最新版本：

  • Mozilla Firefox（3.5及更高版本）
  • Apple Safari（4.0及更高版本）
  • Opera（10.0以上版本）
  • Google Chrome（3.0及更高版本）

您不需要任何特定的软件即可编写HTML和CSS代码。 任何基本的文本编辑器都可以执行此操作（例如记事本，vi，emacs等）。在本教程中，假定源代码存储在本地计算机上的目录中-无需使用Web服务器或将文件上传到Web托管服务。

HTML5的新功能

在本节中，您将发现HTML5必须提供的一些很棒的新功能。 首先，您将学习旨在为现代网页的各个部分赋予含义的新语义元素：页眉，页脚，导航栏，侧栏等。 接下来，您将了解重要的新元素和可用于创建形状，文本，动画，过渡等的2D绘图JavaScript API。 接下来，您将看到新的

发展有关此主题的技能

此内容是用于提高技能的渐进知识路径的一部分。 参阅HTML5基础

语义元素

HTML5规范包括一系列新的语义元素，用于为网页的各个部分或部分赋予一些含义，例如页眉，页脚，导航等。 在以前HTML版本中，通常将使用

元素来创建这些部分，并使用ID或类属性将它们彼此区分开。 这样做的问题是，这没有语义含义，因为没有定义任何指定要使用的类名或ID的严格规则，这使得软件很难确定特定区域在做什么。 HTML5应该有助于减轻这些问题，使Web浏览器更容易解析文档的语义结构。

值得指出的是，继续在HTML5中使用

元素是完全有效的，但是为了将来对您的工作进行验证，建议您在相关时使用语义元素。 另一方面，也建议您避免将这些新元素用于其预期目的以外的目的。 例如，