HTML5入门学习总结
2017-05-10 本文已影响82人
ST_Pace
这两天了解学习了一下HTML5的一些特性，做一些简单的知识总结
HTML5的设计
- 吸取了XHTML2的教训，HTML5的设计有一个主要的原则就是“支持已有的内容”，对于HTML5来说，并不存在创立的起始时间。
- doctype的格式变得十分简洁，并不含有版本号，因为HTML5支持现有的内容，任何未来的版本也支持HTML5中现有的内容。包含DOCTYPE的唯一原因是为确保浏览器以标准模式显示。
<!DOCTYPE html>
- 制定标记文档的字符编码简化为
<meta charset="UTF-8">
- 简化了<script>标签和CSS文件的链接
<script src = "file.js"></script>
<link rel = "stylesheets" href = "file.css">
- 使用HTML5，任何格式的命令都可以，无论大小写，带不带引号，带不带结束符号。使用哪种格式完全取决于程序员。HTML5的语法很随意，但个人应强迫自己使用自己青睐的编码风格。
- 为了照顾浏览器，向后兼容已有内容，HTML5中不含有废弃元素，却含有大量过时元素和属性
<frame><frameset><noframes><acronym><font><big><center><strike>
- HTML5中，可以将多个元素封装在一个<a></a>元素中，唯一需要注意，不可以将a元素嵌套在另一个a 元素中。
富媒体
-
canvas 利用
javascript和canvas创建动态图像十分不错，其内容可随时更新，通过js响应事件使其创建的工具和游戏可以拜托插件 - 音频，将音频嵌入HTML5文档
<audio src = "file.mp3">
</audio>
还具有其他属性autoplay controls autobuffer
通过source元素来指定多种文件格式
<audio controls>
<source src = "file.ogg" type = "audio/ogg">
<source src = "file.mp3" type = "audio/mpeg">
</audio>
起始和结束<audio>之间的任何非source元素都会显示在不支持audio元素的浏览器上
- 视频
<video src = "file.mp4" controls width = "xxx" heigth = "xxx" poster = "xxx.jpg">
</video>
poster属性显示实例图像
Web Forms 2.0
- placeholder
输入栏没有值时的显示文本 - autofocus
加载文件时自动聚焦到某一个特定的表单栏 - required
防止浏览器在必填栏空缺的情况下提交表单 - autocomplete
允许用户禁用每张表单或每个表单栏的自动填充，值可以是"on"或"off" - datalist
允许input和select元素相结合,list属性将选项关联到输入栏
<input type = "text" name= "aaa" id = "aaa" list = "xxx">
<datalist id = "xxx">
<option value = "a1">
<option value = "a2\">
<option value = "a3">
</datalist>
- HTML5 扩展了input元素的type属性
searchemailurltelrangenumberdatacolor
作为一个目标而存在的东西，总是那么美丽而优雅
