• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > HTML5中的article标签是什么?HTML5中的article元素用在什么地方?

HTML5中的article标签是什么?HTML5中的article元素用在什么地方?

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-12-03

本文主要包含HTML5中的article标签含义,HTML5中的article标签的标准属性有哪些?等相关知识,匿名希望在学习及工作中可以帮助到您
HTML5中的article标签是什么?HTML5中的article元素用在什么地方?本篇文章主要为大家解释了什么是HTML5中的article标签,article用在什么地方,还有HTML5中article标签的标准属性有哪些。让我们一起来看看吧。(文末有元素有话说article标签的自我介绍)

HTML5中的article标签解释:

这个标签在HTML5中,意思应该是取代DIV结构的,它定义了一个大的外部框架,就像你我们经常定义的最外层的那对DIV意思一样,现在有了这些自己具有层级结构的不同标记了。

所以article的下面应该还包括很多其它标签。结合后实现分栏之类的设计,CSS也根据这个做了调整以便支持其样式的显示,同时JS也需要些变动,JQuery则依然活跃,并没有因为HTML5重复了其部分功能而被排挤掉

在HTML5中相对于以往版本的文档书写方面,追加了一些标签。如页眉、页脚、内容区等等的元素结构。其中在主体结构元素中增加了article及section元素。那么他们两个有什么区别呢,什么时候用article,什么是用section

想了解HTML5中的sention:HTML5中的section标签是什么?HTML5中的section标签怎么居中?

article元素代表了文档、页面或者是应用程序当中的独立完整可以被外部引用的内容,他可以以一篇文章、一篇帖子、一段评论或者是独立的插件形式出现。除了内容主题以外,一个article元素通常会有自己的标题及脚注。

HTML5中article标签的定义和用法:

<article> 标签定义外部的内容。

外部内容可以是来自一个外部的新闻提供者的一篇新的文章,或者来自 blog 的文本,或者是来自论坛的文本。亦或是来自其他外部源内容。

有实例:

<article>
<a href="http://www.apple.com">Safari 5 released</a><br />
7 Jun 2010. Just after the announcement of the new iPhone 4 at WWDC, 
Apple announced the release of Safari 5 for Windows and Mac......
</article>

article为可以嵌套的元素,原则上需article内层应与外层的内容相关联,例如一篇文章的正文及对正文的评论就可以同过article进行嵌套。

其中section将正文及评论进行了区分,他是一个分块区的元素,下一课会讲解到。article有很完整及独立的将评论的每一条都进行了分割。

article还能用来表示一个插件,下面是一个允许全屏的代码,他的作用就是让这个插件看上去像完全内嵌在网页里面一样。

HTML5中article标签的标准属性:

class, contenteditable, contextmenu, dir, draggable, id, irrelevant,

lang, ref, registrationmark, tabindex, template, title

这里使用article标签布局一篇实例,通过此示例掌握了解article元素标签。

完整HTML5实例代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>article 实例 ThinkCSS</title>
<style>
article{ color:#000}
article h1{ color:#F00}
</style>
</head>
<body>
<article>
    <h1>文章标题</h1>
    <p>文章段落一,内容CSS技术上ThinkCSS网 ...</p>
    <p>文章段落二,内容CSS技术上ThinkCSS网 ...</p>
    <p>段落三,内容CSS技术上ThinkCSS网 ...</p>
</article>
</body>
</html>

提示和注释:

注释:<article> 标签的内容独立于文档的其余部分。

【元素有话说】

article:

同志们好,我是article,是特殊的section,我比section具有更明确的语义,是一个独立的、完整的相关内容块的代表。一般来说, 我会有标题部分(通常包含在 header 内),有时也会 包含 footer 。虽然 section 也是带有主题性的一块内容,但是无论从结构上还是内容上来说,我本身就是独立的、完整的,代表文档、页面或者应用程序中独立完整的可以被外部引用的内容。例如:博客中的一篇文章,论坛中的一个帖子或者一段浏览者的评论等。因为article元素是一段独立的内容,所以article元素中,通常包含头部(header元素)、底部(footer元素)。

【相关推荐】

HTML5中web是什么?web存储中的元素有哪些?

HTML IMG标签的属性是有哪些?了解IMG标签的用法

以上就是HTML5中的article标签是什么?HTML5中的article元素用在什么地方?的详细内容,更多请关注微课江湖其它相关文章!

您可能想查找下面的文章:

  • HTML5中的article标签是什么?HTML5中的article元素用在什么地方?

相关文章

  • 2018-12-03phonegap创建联系人详解
  • 2018-12-03HTML5中的强制下载属性download使用实例解析_html5教程技巧
  • 2018-12-03html5将来会取代native app 吗,我现在学native app,比如android,会不会白学了,以后被淘汰?
  • 2017-08-06Application Cache未缓存文件无法访问无法加载问题
  • 2018-12-03基于HTML5陀螺仪实现移动动画效果
  • 2018-12-03html5播放视频的标签是什么?如何在web页面播放视频呢?(内附实例)
  • 2018-12-03腾讯问卷 http://ur.qq.com/ 是如何实现导航栏毛玻璃背景效果的?
  • 2018-12-0340 个 HTML5 面试题(含答案)
  • 2018-12-03HTML5 虚拟键盘出现挡住输入框怎么办
  • 2017-08-06纯html5+css3下拉导航菜单实现代码

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • HTML5 对各个标签的定义与规定:script
    • H5的LocalStorage如何在本地存储刷新值
    • HTML5中使用postMessage实现Ajax跨域请求的方法_html5教程技巧
    • 移动端h5轮播插件swipe实例详解
    • H5 活动页之移动端 REM 布局适配方法的分析
    • 如何制作一个不错的HTML5响应式网站?
    • 在HTML5中使用MathML数学公式的简单讲解
    • 关于链接中href写javascript表达式出现的错误疑问?
    • vue项目中如何映入noVNC远程桌面
    • 有没有好的用 HTML5 做电子杂志的制作平台?

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有