html5--2.7新的布局元素(4)-time

学习要点

  1. 了解微格式的概念
  2. 掌握time元素的用法
    1. 微格式的概念
      • HTML5中的微格式,是一种利用HTML5中的新标签对网页添加附加信息的方法,附加信息例如新闻事件发生的日期和时间,文章发表的日期等。
      • HTML5中的微格式是为了简化浏览器对数据的提取,方便搜索引擎的搜索.
    1. time元素
      • time是HTML5新增的元素
      • time元素代表24小时中的某个时刻或某个日期,表示时刻时允许带时差。它可以定义很多格式的日期和时间
      • datetime属性中日期与时间之间要用"T"文字分隔,"T"表示时间。请注意倒数第二行,时间加上Z文字表示给机器编码时使用UTC标准时间,表示向机器编码另一地区时间,如果是编码本地时间,则不需要添加时差
      • pubdate属性是个可选标签,加上它搜索引擎/浏览器就可以很方便的识别出那个日期是文章、新闻的发表日期。
    1. time元素示例
      • &lttime datetime="2015-10-22"&gt2015年10月12日&lt/time&gt
      • &lttime datetime="2015-10-22T20:00"&gt2015年10月12日晚上8点&lt/time&gt
      • &lttime datetime="2015-10-22T20:00Z"&gt2015年10月12日晚上8点&lt/time&gt
      • &lttime datetime="2015-10-22T20:00+09:00"&gt美国时间2015年10月12日8点&lt/time&gt

实例

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<time datetime="2015-10-22">文章发表于2015年10月22日</time>
<br>
<time datetime="2015-10-22" pubdate="pubdate">文章发表于2015年10月22日</time>
<body>
</body>
</html>

html5--2.7新的布局元素(4)-time的更多相关文章

  1. html5--2.9新的布局元素(6)-figure/figcaption

    html5--2.9新的布局元素(6)-figure/figcaption 学习要点 了解figure/figcaption元素的语义和用法 通过实例理解figure/figcaption元素的用法 ...

  2. html5--2.9新的布局元素(5)-hgroup/address

    html5--2.9新的布局元素(5)-hgroup/address 学习要点 了解hgroup/address元素的语义和用法 通过实例理解hgroup/address元素的用法 对照新元素布局与d ...

  3. html5--2.1新的布局元素概述

    html5--2.1新的布局元素概述 学习要点 了解HTML5新标签(元素)的优点 了解本章要学习的新的布局元素 了解本章课程的安排 HTML5新标签的优点: 更注重于内容而不是形式 对人的友好:更加 ...

  4. html5--2.6新的布局元素(5)-nav

    html5--2.6新的布局元素(4)-aside/nav 学习要点 了解aside/nav元素的语义和用法 通过实例理解aside/nav元素的用法 aside元素 aside元素通常用来设置侧边栏 ...

  5. html5--2.5新的布局元素(4)-aside/nav

    html5--2.5新的布局元素(4)-aside/nav 学习要点 了解aside/nav元素的语义和用法 通过实例理解aside/nav元素的用法 aside元素(附属信息) aside元素通常用 ...

  6. html5--2.4新的布局元素(3)-section

    html5--2.4新的布局元素(3)-section 学习要点 了解section元素的语义和用法 通过实例理解section元素的用法 article元素和section元素的区别和共同点 art ...

  7. html5--2.3新的布局元素(2)-article

    html5--2.3新的布局元素(2)-article 学习要点 了解article元素的语义和用法 完成一个简单的实例 article元素(标签) 用于定义一个独立的内容区块,比如一篇文章,一篇博客 ...

  8. html5--2.1新的布局元素(1)-header/footer

    html5--2.1新的布局元素(1)-header/footer 学习要点 了解header/footer的语义和用法 使用header/footer进行一个简单的布局 header元素(标签) 用 ...

  9. HTML5中支持新的媒体元素有这些

    HTML5对媒体的支持性很强,支持以下媒体元素: · audio  定义音频 · video  定义视频 · embed  作为外部应用的容器 · source  多种媒体源的支持 · track   ...

随机推荐

  1. C 语言经典100例

    C 语言经典100例 C 语言练习实例1 C 语言练习实例2 C 语言练习实例3 C 语言练习实例4 C 语言练习实例5 C 语言练习实例6 C 语言练习实例7 C 语言练习实例8 C 语言练习实例9 ...

  2. VTK学习之路——画画我的小苹果

    数据集主要由描写叙述数据集几何形状的点集数据及构成数据集的单元构成,因此构建数据集的主要任务就是确定点集和构建单元,本演示样例程序构建了一个苹果的实体,然后绘制苹果.演示样例程序运行的过程例如以下: ...

  3. 看完这篇再不会 View 的动画框架,我跪搓衣板

    引言 众所周知,一款没有动画的 app,就像没有灵魂的肉体,给用户的体验性很差.现在的 android 在动画效果方面早已空前的发展,1.View 动画框架 2.属性动画框架 3.Drawable 动 ...

  4. spark on yarn 配置history server

    spark在yarn模式下配置history server 1.建立hdfs文件– hadoop fs -mkdir /user/spark– hadoop fs -mkdir /user/spark ...

  5. Visual Studio Code v1.17

    Visual Studio Code v1.17发布 欢迎来到2017年9月发行的Visual Studio代码.在这个版本中有一些重要的更新,我们希望你会喜欢,一些关键的亮点包括: macOS To ...

  6. centOS中如何修改运行级别!

    在图形化界面可以用Ctrl+Alt+F2进入命令行窗口 * 假如你使用了虚拟机,有可能会出现不能进去的问题,原因是因为热键冲突 * 解决办法:修改热键就行了 edit→parameter→hot ke ...

  7. 一个用消息队列 的人,不知道为啥用 MQ,这就有点尴尬

    消息队列 为什么写这篇文章? 博主有两位朋友分别是小A和小B: 小A,工作于传统软件行业(某社保局的软件外包公司),每天工作内容就是和产品聊聊需求,改改业务逻辑.再不然就是和运营聊聊天,写几个SQL, ...

  8. 利用GROUP_CONCAT函数把相同信息的合并到同一个字段中

    SELECT a.*,GROUP_CONCAT(b.pri_name) FROM sh_role a LEFT JOIN sh_privilege b ON FIND_IN_SET(b.id,a.pr ...

  9. T-SQL简单查询语句(模糊查询)

    T-SQL简单查询语句 简单查询: 1.最简单查询(查所有数据) select * from 表名: 注:* 代表所有列 select * from info 2.查询指定列 select code, ...

  10. php调用短网址接口

    <?php $ch=curl_init(); curl_setopt($ch,CURLOPT_URL,"http://dwz.cn/create.php"); curl_se ...