html5
<p>css3新增方法:calc(),运算符右"+"和"-"时,其左右要加空格,有"*"和"/"时可以不加,建议加上空格H</p><h2>HTML5简介</h2>
<p class="A">什么是HTML5</p>
<p class="A0">1、HTML5 是下一代 HTML 标准。</p>
<p class="A0">2、HTML , HTML 4.01的上一个版本诞生于 1999 年。自从那以后,Web 世界已经经历了巨变。</p>
<p class="A0">3、HTML5是HTML最新的修订版本,2014年10月由万维网联盟(W3C)完成标准制定。</p>
<p class="A0">4、HTML5的设计目的是为了在移动设备上支持多媒体。</p>
<p class="A0">5、HTML5 简单易学。</p>
<p class="A">HTML5 的优点</p>
<p class="A0">1、提高可用性和改进用户的友好体验。</p>
<p class="A0">2、有几个新的标签,这将有助于开发人员定义重要的内容。</p>
<p class="A0">3、可以给站点带来更多的多媒体元素(视频和音频)。</p>
<p class="A0">4、可以很好的替代FLASH和Silverlight。</p>
<p class="A0">5、将被大量应用于移动应用程序和游戏。</p>
<p class="A0">6、可移植性好</p>
<h2><strong>HTML5中新增的元素</strong></h2>
<p>(1)、<canvas>新元素</p>
<p><canvas>标签定义图形,比如图表和其他图像。该标签基于JavaScript的绘图API</p>
<p>(2)、新多媒体元素</p>
<p><audio>定义音频内容</p>
<p><video>定义视频(video或者movie)</p>
<p><source>定义多媒体资源<video>和<audio></p>
<p>(3)、新表单元素</p>
<p><datalist>定义选项列表。请与input元素配合使用该元素,来定义input可能的值。</p>
<p><output>定义不同类型的输出,比如脚本的输出。</p>
<p>(4)、新的语义和结构元素</p>
<p>HTML5提供了新的元素来创建更好的页面结构:</p>
<p><article>定义页面独立的内容区域。</p>
<p><aside>定义页面的侧边栏内容。</p>
<p><command>定义命令按钮,比如单选按钮、复选框或按钮</p>
<p><details>用于描述文档或文档某个部分的细节</p>
<p><dialog>定义对话框,比如提示框</p>
<p><summary>标签包含details元素的标题</p>
<p><footer>定义section或document的页脚。</p>
<p><header>定义了文档的头部区域</p>
<p><nav>定义导航链接的部分。</p>
<p><progress>定义任何类型的任务的进度。</p>
<p><section>定义文档中的节(section、区段)。</p>
<p> </p>
<p> </p>
<h2><strong>.HTML5中移出的标签</strong></h2>
<p>美元符号定义jQuery</p>
<p>以下的HTML4.01元素在HTML5中已经被删除:</p>
<p><acronym>、<applet>、<basefont>、<big>、<center>、<dir>、<font>、<frame>、<frameset>、<noframes>、<strike>、<tt></p>
<p> </p>
<p><datalist>元素</p>
<p><datalist>元素规定输入域的选项列表,<datalist>属性规定form或input域</p>
<p>应该拥有自动完成功能。当用户在自动完成域中开始输入时,浏览器应该在该域中</p>
<p>显示填写的选项:使用<input>元素的列表属性与<datalist>元素绑定。</p>
<p><input list="browsers"></p>
<p> <datalist id="browsers"></p>
<p> <option value="InternetExplorer"></p>
<p> <option value="Firefox"></p>
<p> <option value="Chrome"></p>
<p> <option value="Opera"></p>
<p> <option value="Safari"></p>
<p> </datalist></p>
<p> </p>
<p>Output 输出结果 name 你要操作的表单元素的变量,for:定义一个或多个元素的输出域的元素。</p>
<h2><strong>新的表单属性</strong></h2>
<p>(1)、placeholder占位符</p>
<p>(2)、autofocus获取焦点</p>
<p>autofocus属性是一个boolean属性.</p>
<p>autofocus属性规定在页面加载时,域自动地获得焦点。</p>
<p>(3)、autocomplete自动完成,用于表单元素,也可用于表单自身</p>
<p>autocomplete属性规定form或input域应该拥有自动完成功能。</p>
<p>当用户在自动完成域中开始输入时,浏览器应该在该域中显示填写的选项。</p>
<p>提示:autocomplete属性有可能在form元素中是开启的,而在input元素中是关闭的。</p>
<p>注意:autocomplete适用于<form>标签,以及以下类型的<input>标签:text,search,url,</p>
<p>telephone,email,password,datepickers,range以及color。</p>
<p>(4)、name指定表单项属于哪个form,处理复杂表单时会需要</p>
<p>(5)、novalidate关闭验证,可用于<form>标签</p>
<p>novalidate属性是一个boolean(布尔)属性.</p>
<p>novalidate属性规定在提交表单时不应该验证form或input域。</p>
<p>(6)、required验证条件,(必填项)</p>
<p>required属性是一个boolean属性.</p>
<p>required属性规定必须在提交之前填写输入域(不能为空)。</p>
<p>注意:required属性适用于以下类型的<input>标签:text,search,url,telephone,email,password,</p>
<p>datepickers,number,checkbox,radio以及file。</p>
<p>(7)、pattern正则表达式验证表单</p>
<p>pattern属性描述了一个正则表达式用于验证<input>元素的值。</p>
<p>注意:pattern属性适用于以下类型的<input>标签:text,search,url,tel,email,和password.</p>
<p>提示:是用来全局title属性描述了模式.</p>
<p>提示:您可以在我们的JavaScript教程中学习到有关正则表达式的内容</p>
<p>(8)、maxlength最大长度minlength最小长度 一般用于text文本属性</p>
<p><strong>Onkeydown 与 onkeypress区别</strong></p>
<p>Keydown按键的范围大</p>
<p> </p>
<p> </p>
<h2><strong> .表单新增的事件</strong></h2>
<p>oninput用户输入内容时触发,可用于移动端输入字数统计</p>
<p>document.getElementById("name").oninput=function(){</p>
<p>console.log(this.value);</p>
<p>}</p>
<p>document.getElementById("name").onkeyup=function(){</p>
<p>console.log("---"+this.value);</p>
<p>}</p>
<p> </p>
<p>Paused 暂停 video mp4</p>
<h2><strong>多媒体</strong></h2>
<h3><strong>Audio(音频)</strong></h3>
<p>controls如果出现该属性,则向用户显示音频控件(比如播放/暂停按钮)。</p>
<p>loop如果出现该属性,则每当音频结束时重新开始播放。</p>
<p><em>muted如果出现该属性,则音频输出为静音。</em></p>
<p><em>Paused 暂停</em></p>
<h3><strong><em>Video(视频)</em></strong></h3>
<p><em>controls如果出现该属性,则向用户显示控件,比如播放按钮。</em></p>
<p><em>height设置视频播放器的高度。</em></p>
<p><em>loop如果出现该属性,则当媒介文件完成播放后再次开始播</em></p>
<p><em>放。</em><em><br></em><em>muted如果出现该属性,视频的音频输出为静音。</em><em><br></em><em>width设置视频播放器的宽度。</em></p>
<p><em>Paused 暂停</em></p><br><br>
来源:https://www.cnblogs.com/cxyll990414/p/13526290.html
頁:
[1]