HTML5-常用标签

5 篇文章 0 订阅

<header>,<footer><aside>

页眉,页脚,边栏。

<artical><section>

文章新闻,博客,帖子;文档主要区块。

<time>

时间,格式如下:

<time datetime="2012-02-18">2/10/2012</time>

datetime必须按照规定格式书写,不然元素内容需要采用官方iternet时间格式。若datetime按照规定书写,则元素内容格式任意。

格式:

  • 年-月-日 时:分 例如:1994-09-12 06:30
  • 年-月-日 例如:1994-09-1
  • 时:分 例如:06:30
  • 时:分z 例如:06:30z 表示UTC时间
  • 可以缺省日,月。

导航栏,为页面快速指引的关键。一般导航栏的内容会放在<ul>中。

<nav>
    <ul>
        <li class="selected"><a href="">***</a></li>
        <li><a href="">***</a></li>
        <li><a href="">***</a></li>
    </ul>
</nav>
nav {
    ...
}

nav ul {
    list-style-type: none; /*删除列表项目符号*/
}

nav ul li {
     display:  inline; /*块元素改为內联元素,在一行内显示*/
}

nav ul li a:link, ul li a:visted {
    ...
}

nav ul li.selected {
    ...
}

<video>

我们可以使用video引入视频文件,也可以使用flash,js。但是使用标签相对更方便。不同浏览器对视频格式支持不同,所以在引用源文件时,我们要准备多个格式源文件。

格式:

<video controls /*加载控件,缺省则无*/
       autoplay /*自动播放,缺省点击播放*/
       loop /*循环播放*/
       preload="none" /*视频是否提前加载(none(不加载),metadata(下载元数据,不加载内容),auto(按照是否自动播放和带宽加载))*/
       width="512" height="288" /*指定视频和poster大小*/
       poster="...png" /*视频播放前显示内容*/
       id="video" 
       <source src="...mp4"> /*浏览器加载所有sorce,自动选择合适视频格式进行播放*/
       <source src="...webm">
       <source src="...ogv">
       <p>sorry, it's something wrong</p> /*视频无法加载时显示本段文字*/
       <object> </object> /*当source无法加载时,加载此处flash动画*/

如果只提供一种视频格式,则可以将source改为src。多种格式,使用source,浏览器会加载每一种格式,浪费时间。可以提供多种属性,方便浏览器选择。

<source src="......mp4" type='video/mp4; codecs="avc1.420E01E, mp4a.40.2"'>

其他常用标签

<mark>:用于突出文本。
<progress>:显示进度条。
<audio>:包含声音内容。
<meter>:显示范围度量。
<canvas>:显示js图像和动画。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值