For html5although by much, but still have some knowledge a bit confusing, remember not clear, so I want to sort out special
HTML5 browser support
The latest version of Safari, Chrome, Firefox, Opera support some HTML5 features, IE9 will support some HTML5 features
In addition, all browsers, including the old new, unrecognized element of automatically treated as inline elements.
The following version of the IE9 browser compatible HTML5 approach, using static resources html5shiv package
<!--[if lt IE 9]>
<script src="http://cdn.static.runoob.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]--> Or directly to the script file code shows up
<!--[if lt IE9]>
<script>
(function(){
if(!*@cc_on!@*/0) return;
var e = "abbr,article,aside,audio,canvas,datalist,details,dialog,event,source,figure,footer,header,hgroup,mark,menu,nav,outputmprogress,section,time,video".split('.'),
i = e.length;
while(i--){
document.createElement(e[i])
}
})
</script>
<![endif]-->This code may also be placed in a separate html5.js while this part needs to be placed headinside
the loading, initialization of a new tagCSS
/*html5*/
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block;}HTML5 new element
<canvas>
canvasTo draw graphics via scripting
Examples
<canvas id="myCanvas"></canvas>
<script type="text/javascript">
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
ctx.fillStyle="#ff0000";
ctx.fillRect(0,0,80,100);
</script>New multimedia elements
<audio>
<video>
<source>
<embed>
<track>
<audio>
audioCustom audio content
attributes: autoplayIf this attribute is present, the audio is ready to play immediately after controlif the property is in, then displayed to the user audio controls (such as Play / Pause button) loopif the property appears whenever the end of the audio replay mutedif there is the property, the audio output is muted preloadvalues are auto, metadata, none, specified when the page is loaded, whether the default audio is loaded and how the load srcspecified audio file url
Examples
<audio control>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
您的浏览器不支持audio元素
</audio><video>
videoTag defines video, such as a movie clip or other video streams
supports three video formats: MP4, WebM, Ogg
property:
In addition to having audioall the attributes, but also increased width, heighttwo properties
Examples
<video control>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
您的浏览器不支持video标签
</video><embed>
Defines a container, or for embedding interactive external application program (plug-in)
properties: height, src, typespecified MIME type content is embedded,width
Examples
<embed src="helloworld.swf"><track>
Such as a <video> and <audio> element like a predetermined external text media track
New form elements
<datalist>
<keygen>
<output>
<datalist>
Defined list of options
IE 9 and earlier versions of IE and Safari browser does not support <datalist> tag.
Examples
<input list="browsers">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist><keygen>
Form fields are specified for the key pair generator.
When submitting a form, sent to the server private key is stored in a local, public key.
IE does not support the element
Properties: autofocusShi <keygen>Field has the focus when the page loads challengeif used, then the keygenvalue set for the inquiry at the time of submission disableddisable keygenfield formdefinitions of the <keygen>one or more form field belongs keytypevalue including rsa, dsa, ec, security algorithm defines key namedefinitions <keygen>element the only name, name attribute is used to collect the value of the field when the form is submitted miscellaneous
Examples
<form action="demo_keygen.asp" method="get">
用户名: <input type="text" name="usr_name">
加密: <keygen name="security">
<input type="submit">
</form><output>
As the calculation result output display (such as the output of the execution of the script)
IE does not support
Properties:
`for 'describe the relationship between the calculation result of the calculation elements used in formone or more of the input form definition field belongs to namea unique name definition object (using the form submission)
Examples
<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" id="a" value="50">100
+<input type="number" id="b" value="50">
=<output name="x" for="a b"></output>
</form>New semantic and structural elements
<article>
<aside>
<Bdi> allows you to set a text, so text direction from its parent element
<command> Custom Command buttons, such as radio buttons, check boxes or buttons, only IE9 support
<details>
<dialog>
<summary>
<figure>
<figcaption>
<footer>
<header>
<mark>
<Meter> defined metrology. It is only used to measure the maximum and minimum known
<nav>
<progress>
<Ruby> definition of ruby annotation (Chinese phonetic or characters)
<Rt> defined characters (Chinese phonetic or characters) the interpretation or pronunciation
<section>
<time>
<Wbr> specified in the text where appropriate newline character
Examples
<bdi>
At present, only Firefox and Chrome support <bdi> tag.
<ul>
<li>Username <bdi>Bill</bdi>:80 points</li>
<li>Username <bdi>Steve</bdi>: 78 points</li>
</ul>
将用户名从周围的文本方向设置中隔离出来<Summary>
<Details> element is defined as a visible header. When the user clicks the title will show the details.
<details>
<summary>Copyright 1999-2011.</summary>
<p> - by Refsnes Data. All Rights Reserved.</p>
<p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
</details><progress>
defined running task progress (progress bar)
<progress value="22" max="100"></progress><wbr>
If the word is too long, or you're worried about browser will wrap in the wrong place, then you can use the <wbr> element to add Word Break Opportunity (word wrap timing).
<p>学习 AJAX ,您必须熟悉 <wbr>Http<wbr>Request 对象。</p>This article is reproduced in: ape 2048➤ https://www.mk2048.com/blog/blog.php?id=hh2c0k2akhj