HTML5 article标签,<time>...</time>标签和pubdate属性的运用

这篇具有很好参考价值的文章主要介绍了HTML5 article标签,<time>...</time>标签和pubdate属性的运用。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

1、<article>...</article>标签的运用

        article标签代表文档、页面或应用程序中独立的、完整的、可以独自被外部引用的内容。它可以是一篇博客或报竟杂志中的文章、一篇论坛帖子、一段用户评论或一个独立的插件,或者其他任何独立的内容。把文章正文放在header元素后面的p元素中,然后用section标签把正文与评论部分进行区分。section是一个分块标签可以单独存储到数据库中或输出到word文档中。用来对页面中的内容进行分块,在section标签中嵌入评论的内容,评论中有几个人的评论,每个人的评论部分相对来说又是比较独立、完整的,因此对它们都使用一个article标签,在评论的article标签中,又可以分为标题与评论内容部分,分别放在header标签与p标签中。关于示例中提到的time标签与pubdate属性,可查看本节结尾处关于time标签与pubdate属性的说明.

dw页面效果截图:

HTML5 article标签,<time>...</time>标签和pubdate属性的运用,html5,前端,html

HTML5代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>

<body>
<article>
	<header>
		<h1>苹果</h1>
		<p>发表日期:
			<time pubdate datetime="2010/10/09">2010/10/09</time>
		</p>
	</header>
	<p><b>苹果</b>,植物类水果,多次花果...("苹果"文章正文)</p>
	<section>
		<h2>评论</h2>
		<article>
            <header>
                <h3>发表者:陆凌牛</h3>
                <p>
                    <time pubdate datetime="2010-10-10T19:10-08:00">
                        1小时前
                    </time>
                </p>
            </header>
        <p>我喜欢苹果,我最喜爱的品种是红富士。</p>
		</article>
		<article>
            <header>
                <h3>发表者: 张玉</h3>
                <p>
                    <time pubdate datetime="2010-10-10T19:15-08:00">
                        1小时前
                    </time>
                </p>
            </header>
        	<p>苹果? 我不喜欢,我喜欢吃橘子。</p>
      	</article>
	</section>
</article>
</body>
</html>

   2、<time>...</time>标签和pubdate属性的运用 

         示例中有两个time元素,分别定义了两个日期:一个是舞会日期,另一个是通知发布日期。由于都使用了time元素,所以需要使用pubdate属性表明哪个time元素代表通知的发布日期。

dw页面效果截图:

HTML5 article标签,<time>...</time>标签和pubdate属性的运用,html5,前端,html文章来源地址https://www.toymoban.com/news/detail-785568.html

HTML5代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>

<body>
<footer>
</footer>
<article>
	<header>
		<h1>关于<time datetime=2010-10-29>10月29日</time>的舞会通知</h1>
        <p>发布日期:
			<time datetime=2010-10-11 pubdate>2010年10月11日</time>
        </p>
	</header>
	<p>大家好:我是法律系3年级学生代表,...(关于舞会的通知)</p>
</article>

</body>
</html>

到了这里,关于HTML5 article标签,<time>...</time>标签和pubdate属性的运用的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • HTML5 <s> 标签、HTML5 <sub> 和 <sup> 标签

    s 标签定义加删除线的文本。HTML 5 中不再支持这个标签。请使用 CSS 代替。 在 HTML 4.01 中不赞成使用 s 标签。 在 HTML 5 中不支持 s 标签。 提示:请使用 del 标签代替。 关于s 标签的详细详细,你可以参考本站的“HTML s 标签”一节! HTML5 sub和sup标签分别为文档中的内容定义下标

    2024年02月01日
    浏览(76)
  • web头歌 html5-图像的运用

    一、新媒体新闻网页的设计 任务描述 本关任务:编写一个带有背景图的新闻网页。 相关知识 为了完成本关任务,你需要掌握:1.网页背景的设置,2.标题标签,3.水平线标签,4.段落标签,5.font标签。 编程要求 在右侧编辑器中的 Begin - End 区域内补充代码,具体要求是: 1.为

    2024年02月02日
    浏览(40)
  • 【HTML5系列】第一章 · HTML5新增语义化标签

            Hello大家好, 我是【 麟-小白 】,一位 软件工程 专业的学生,喜好 计算机知识 。希望大家能够一起 学习进步 呀!本人是一名 在读大学生 ,专业水平有限,如发现 错误 或 不足之处 ,请多多指正!谢谢大家!!!         如果 小哥哥小姐姐们 对我的文章感兴趣

    2024年02月04日
    浏览(59)
  • HTML5新增的标签

    header :头部标签 nav :导航标签 article :内容标签 section :定义文档某个区域 aside :侧边栏标签 footer :尾部标签 当前audio仅支持三种视频格式:尽量使用mp3格式 常见属性: 属性 值 描述 autoplay autoplay 如果出现该属性,则音频在就绪后马上播放 controls controls 如果出现该属性,则向用户

    2024年02月04日
    浏览(38)
  • HTML5前端标签练习

    标签的分类 标签的嵌套 a标签 验证form表单朝后端提交数据 效果 代码

    2024年02月08日
    浏览(55)
  • HTML5 <select> 标签

    HTML5 select标签用于实现下拉列表。请参考下面的示例: 创建带有 4 个选项的选择列表: 尝试一下 » 所有主流浏览器都支持 select 标签。 select 元素用来创建下拉列表。 select 元素中的 option 标签定义了列表中的可用选项。 提示: select 元素是一种表单控件,可用于在表单中接

    2024年02月02日
    浏览(42)
  • HTML-常见标签、HTML5新特性

    (1) C/S架构即Client/Server(客户机/服务器)结构。 (2) C/S 架构特点 ​ C/S结构在技术上很成熟,它的主要特点是交互性强、具有安全的存取模式、网络通信量低、响应速度快、利于处理大量数据。但是该结构的程序是针对性开发,变更不够灵活,维护和管理的难度较大。通常只

    2024年02月11日
    浏览(71)
  • HTML5概述 - 语义化标签

    1、什么是 HTML5 HTML5 不是一门新的语言,而是我们之前学习的 HTML 的第五次重大修改版本。 2、HTML 的发展历史 •超文本标记语言(第一版,不叫 HTML 1.0)——在 1993 年 6 月作为互联网工程工作小组(IETF)工作草案发布(并非标准);•HTML 2.0——1995 年 11 月作为 RFC 1866 发布

    2024年02月08日
    浏览(59)
  • HTML5基础语法与标签

    HTML5是什么? HTML5是超文本标记语言(HTML)的第五个主要版本,用于描述网页结构和呈现内容。它是到目前为止最新且最强大的HTML版本。 HTML5语法约定 1.标签是HTML语法中的基本单位,由尖括号 ​​ 包围,每个标签通常有一个起始标签(opening tag)和一个结束标签(closing t

    2024年02月13日
    浏览(58)
  • HTML5 自定义属性

    HTML5 提供了自定义属性(Custom Attributes)的功能,允许开发者在 HTML 元素上添加自定义的属性,以便存储额外的数据或提供特定的功能。 自定义属性的命名应以 \\\"data-\\\" 开头,后面可以跟上任意的自定义名称。这样的命名约定有助于确保自定义属性不与 HTML 或其他标准属性冲突

    2024年02月12日
    浏览(32)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包