H5学习

作者: 长大吃可爱多 | 来源:发表于2020-05-21 09:08 被阅读0次

HTML5文档标签声明<!Doctype>不是HTML标签,只是声明HTML的版本的

1.HTML5里面没有DTD声明,DTD是什么,HTML5为什么没有?

DTD可以定义合法的XML文档定义模块
在HTML中DTD规定了标记语言的规则,这样浏览器就可以按照规则来呈现内容
HTML5不是引用的SGML 所以不需要引用DTD

2.HTML新增的标签

 2.1 结构标签 (有意义的div标签)
   <article> 标记定义一篇文章
   <header> 标记定义一个页面或者一个区域(页面的头部)
   <nav>     标记定义导航连接
   <section>  定义一个区域
  <aside>   标记定义页面内容部分的侧边栏
  <hgroup>  标记定义文件中的一个去区块的相关信息
  <figure>    定义一组媒体内容及他们的标题
  <figcaption>  标记定义figure元素的标题
  <footer> 标记定义一个页面或一个区域的底部(页面的底部)
  <dialog>  标记定义一个对话框

一般<header> <section> <footer>放在最外层,其他的标签放在这三个标签的里面
<article> <nav> <aside> <hgroup> <figure> <dialog> 互不嵌套 里层可以放div标签

2.2 多媒体标签
   <video> 视频标签
   <audio> 音频标签
     属性: autoplay:自动播放  
            loop:-1 重复播放的次数 -1表示重复播放无数次
            controls:设置音频控件的显示方式 显示/隐藏
   <source> 媒体资源标签
  可以放在audio标签的里面,用于指定媒体资源,以及使用type属性指定媒体资源的转码
  如果有多个资源可以使用这个标签,会播放可以播放的格式
<canvas> 画布,定义画布
<embed> 定义外部的可交互的内容和插件   
              可以解析flash文件格式的图片

多媒体标签的意义
富媒体的发展已经支持不使用插件就可以操作媒体文件,极大的提高了用户体验

2.3  web应用标签
<meter> 状态标签(实时状态显示气压 气温)
<progress> 任务标签(任务过程:安装、加载)
2.4 列表标签
 用列表标签可替代原始的下拉<select>标签,而且还可以输入,比select标签要更为强大。
 datalist标签的使用
<input list="iphoneList" />
 <datalist id="iphoneList">
    <option value="iphone">iphone</option>
    <option value="meizu">meizu</option>
</datalist>
详细标签,可展开
<details>
    details...............................
</details>

注释标签

2.5注释标签
  对于需要显示出来的注释可以使用<ruby>标签括起来需要注释的字或者词。在ruby标签内部使用<rt>标签来存放需要注释的内容

其他标签

2.6 mark标签
<mark> 可标记需要标记的词语
<output> 异步标签运算
 <form oninput="totalPrice.value=parseInt(price.value)*parseInt(number.value)">
        <input type="text" id="price" value="5000">
        *<input type="number" id="number" value="1"> =
        <output name="totalPrice" for="price number"></output>
    </form>

相关文章

网友评论

      本文标题:H5学习

      本文链接:https://www.haomeiwen.com/subject/dqkgohtx.html