推开HTML5的大门
时间：2018-09-26 来源：未知
随着互联网技术的迅猛发展，尤其是移动互联网正发生着日新月异的变化。HTML5作为连接传统互联网与移动互联网的桥梁，已经成为未来互联网发展的主流。要想学好HTML5，首先要知道以下几点：
1.什么是HTML5？
要想深入学习一门语言，或者想要从事一种行业，首先要知道它是什么。HTML5是W3C（万维网联盟）和WHATWG（网络超文本应用技术工作组）合作产生的，不是区别于HTML的，但它是新的HTML标准，它的目标是提供所有内容，而不是需要像falsh，silverlight等额外插件的支持。
2．既然HTML5是新的HTML标准，那它与前面的HTML标准有什么不同？
接触过HTML的人都知道，一个典型的WEB页面包含头部，脚部，导航，中心区域，侧边栏。但是这些页面结构要想呈现出来，HTML4及其以前需要使用DIV标签，但是在HTML5中，这些DIV标签被元素名称所取代，这就使得HTML更加可读，形成页面结构的HTML5元素的名称主要有：<header>：代表HTML的头部数据，<footer>：页面的脚部区域，<nav>：页面导航元素，<article>：自包含的内容，<section>：使用内部article定义区域或者把分组内容放到区域里，<aside>：代表页面的侧边栏内容；HTML4及其以前的页面头部会包含很长的声明，而HTML5只需要放入<!DOCTYPE HTML>，浏览器就能自动识别它是HTML文档，同时HTML5的标签也能够正常使用，否则HTML5标准下，它无法正常工作；相对于HTML4及其以前版本，HTML5增加了多个元素标签，如对音视频的支持等。
3．哪些浏览器支持HTML5？
现在的主流浏览器都支持，如Safari，FireFox，Chrome，Opera，IE等。
4．刚才我们说过HTML5增加了多个元素标签，那么HTML5中有哪些不同的新的表单元素类型？
Color：显示颜色选择对话框，如<input type=”color” name=”favcolor”>
Date：显示日历对话框，如<input type=”date” name=”dayq”>
Datetime-local：显示含有本地时间的日历，如<input type=”datetime-local” name=”daytimey”>
Email：创建含有email校验的HTML文本框，如<input type=”email” name=”email”>
Time：只能输入时间，如<input type=”time” name=”timey”>
Url：设置URL的验证类型为url，如<input type=”url” name=”seturl”>
Range：显示控制范围，如<input type=”range” min=”0” max=”10” step=”2” value=”5>
Telephone：使用文本框接受电话号码，如<input type=”tel” name=”tele”>
Number：使用文本显示数字范围，如<input type=”number” name=”quantity” min=”1” max=”8”>
Search：让文本框作为搜索引擎，如<input type=”search” name=”engine”>
5．HTML5中的canvas是什么？以及如何使用Canvas来画一条简单的线？
Canvas是HTML中你可以绘制图形的区域。要想画一条简单的线，要做3步：首先是定义Canvas区域，其次是获取访问canvas上下文区域，第三是绘制图形。
定义Canvas区域：<canvas id=”mycanvas” width=”600” height=”400” style=”border:1px solid #000000”></canvas>
获取访问canvas上下文区域：var c=document.getElementById(“mycanvas”);
var ctx=c.getContext(“2d”);
绘制图形：调用“move”方法并从一个点开始，使用线条方法绘制线条然后使用stroke方法结束。如：ctx.moveTo(10,10); ctx.lineTo(200,100); ctx.stroke();
6．CSS是什么？CSS中的选择器是什么？以及如何使用ID值来应用一个CSS样式？
CSS的全称为cascading style sheets，级联样式表，CSS的选择器在我们想要应用一个样式的时候，帮助我们去选择元素。如，简单的被命名为”instro”的样式，他适用于HTML元素显示红色背景
<style>
.intro{
background-color:red;
}
</style>
应用上面的”intro”样式给div，我们可以使用”class”选择器：
<div class="intro">
<p>My name is Shivprasad koirala.</p>
<p>I write interview questions.</p>
</div>
那么如何使用ID值来应用一个CSS样式呢？首先假设，你有一个HTML段落标签，使用id是”mytext”，就和下面的片段中显示的那样，
<p id="mytext">This is HTML interview questions.</p>
可以使用”#”选择器和”id”的名字创建一种样式，并把CSS值应用到段落标签中，因此应用样式到”mytext”元素，我们可以使用”#mytext”，如下所示：
<style>
#mytext
{
background-color:yellow;
}
</style>
以上6点，只是推开了我们走向HTML开发的大门，要想深入了解HTML，还需要我们不断的努力，去探索与实践，才能在HTML的世界自由翱翔。
