article标签,使用后感觉和P(段落)差不多,语义化的标签。
<aside> 标签定义article以外的内容(可用做文章的侧栏). 语义化的标签。  html 标签有几种分类,其中有一种就是网页布局性质的标签,如最常用的 div。
抛开以前的传统网页布局(table布局)不谈,就说现在的网页布局——div+css。 你比如说,你要做一个最简单的一行两列的网页,外层是一个 div 容器,里面两个 div,左边是导航菜单,右边是内容,为了实现网页布局,你肯定得用 css 定位,为了方便定位,你肯定得为 div 设置 id 或者 class,我们暂且用 id。 外层容器 div :id="wrap",内层左边 div:id="aside",内层右边 div:id="article"。
为什么左边导航 id 要给它设置为 aside(旁边),而不用 div1、div2 呢?
因为 aside 赋予了 div 意义,给当前开发者和后期维护者带来方便,一看到 <div id="aside"> 我就知道它的作用,看到 <div id="div1"> 谁知道这是什么东西,就像 div 标签本身一样,毫无意义。 而 article 和 aside 就像 div 一样,只是布局标签,除了标签名字不一样,其他功能意义基本是一样的,article、aside 里面的字体、背景、边框等没有任何特殊的样式,也不是鼠标点击了 aside 标签之后会出现什么特殊的效果,因为它们只是简简单单的标签。
既然功能和 div 一模一样,html5 为何多此一举,又生产出几个多余的 “div” 出来呢?
有句话叫做:存在的就是合理的。 因为很多网站布局是重复的,全世界网站有很多都是左边是导航,右边是正文内容,然后给div设置id来用css布局,因为有这个需求,html5 就人性化的添加了几个标签,从而简化了开发人员的开发,毕竟,<aside> 与 <div id="aside">,那个更好?
html 角度:前者比后者少写几行代码,一定程度简化了网页文件大小。
css 角度:前者直接使用 aside 就能获取到标签,后者需要通过 id 。
js 角度:同上。 之前也听说过这么一个消息,说一些移动设备(如 ipad),在解析 html5 标签时,遇到 aside 标签可能会有个性化的展示,可能效果更美观。 总结:
<article> 就看做是 <div id="article">,<aside> 你就看做是 <div id="aside">,仅仅是人为的给div 换了一个说话,换汤不换药,还是 div 。

article标签和aside标签两者的理解的更多相关文章

  1. h1、h2、h3标签及strong标签对页面seo的影响

    今天和大家来聊下h1,h2,h3,strong几个标签,在网页中的使用对页面seo的影响,也阐述了个人的一些想法. 首先简要讲下H标签及strong标签的含义:<h1>.<h2> ...

  2. code标签和pre标签

    code标签: 1.code标签的定义: <code>标签, 用于表示计算机源代码或者其他机器可以阅读的文本内容.软件代码的编写者习惯了编写代码时的代码格式,那么这个<code> ...

  3. JavaWeb学习记录(十九)——jstl自定义标签之简单标签

    一.简单标签共定义了5个方法: setJspContext方法 setParent和getParent方法 setJspBody方法 doTag方法 二.方法介绍 osetJspContext方法 用 ...

  4. 【转】object标签和embed标签

    我们现在大部分人做网页,都是直接用DW插入flash,而且DW也是所见即所得,直接生成了相应的flash显示代码.可是我们又有多少人了解这些直接由DW生成的代码呢?其实我接触flash player标 ...

  5. 学会怎样使用Jsp 内置标签、jstl标签库及自定义标签

    学习jsp不得不学习jsp标签,一般来说,对于一个jsp开发者,可以理解为jsp页面中出现的java代码越少,对jsp的掌握就越好,而替换掉java代码的重要方式就是使用jsp标签.  jsp标签的分 ...

  6. 自学HTML5第二节(标签篇---新增标签详解)

    HTML5新增标签: <article> 标签 规定独立的自包含内容.一篇文章应有其自身的意义,应该有可能独立于站点的其余部分对其进行分发. <article> 元素的潜在来源 ...

  7. 剖析html对标准标签和自定义标签闭合与不闭合渲染问题

    昨天在修改去年写的系统的时候无意中看到了当时写的一个利用标准标签未闭合在单元格内把整个单元格颜色渲染成红色的效果,如下: 当时的问题是从后台返回来的是个int整数而%是写在页面上的如图 这 时候就出现 ...

  8. struts2标签库----控制标签详解

         前面几篇文章我们介绍了有关struts2的基本内容,简单理解了整个框架的运作流程.从本篇开始我们逐渐了解和使用struts2为我们提供的标签库技术,使用这些标签可以大大降低我们表现层的开发难 ...

  9. @Autowired标签与 @Resource标签 的区别

    Spring不但支持自己定义的@Autowired注解,还支持由JSR-250规范定义的几个注解,如:@Resource. @PostConstruct及@PreDestroy. 1. @Autowi ...

随机推荐

  1. C# 无边框窗口实现拖动

    原文地址:http://blog.csdn.net/sky___ice/article/details/11533321 Form1.Designer.cs: // //Form1 // this.M ...

  2. Elasticsearch安装ik中文分词插件(四)

    一.IK简介 IK Analyzer是一个开源的,基于java语言开发的轻量级的中文分词工具包.从2006年12月推出1.0版开始, IKAnalyzer已经推出了4个大版本.最初,它是以开源项目Lu ...

  3. java操作mongodb——更新数据

    Java中可以通过updateOne,updateMany,replaceOne方法进行集合的文档更新.但是 _id 是不能更新的 updateOne只会更新一条数据,即使通过Filters.lt(& ...

  4. String使用拼接对性能的影响和原因。

    需要频繁的拼接String的时候,使用\'+\'拼接会影响性能,应该用StringBuilder或者StringBuffer的append反方法来拼接,从执行速度上来讲:StringBuilder & ...

  5. VMware安装ubuntu,通过/mnt/hgfs 挂载共享Windows系统文件夹

    网上各种相关的配置说明,但是都没一个完整的,在这里楼主结合实战亲测,这一整套包含各种情况 1.安装VMware tools 2.解压到任意一个文件夹 tar -xzvf VMwareTools**** ...

  6. openstack私有云布署实践【10.2 计算nova - controller节点配置(办公网环境)】

    一.首先登录controller1创建nova数据库,并赋于远程和本地访问的权限.     mysql -u root -p   CREATE DATABASE nova; GRANT ALL PRI ...

  7. 手机端rem自适应布局实例

    首先要书写核心js代码,控制住页面的初始大小:我是以750px(即iPhone6)的标准,设置font-size:100px:<script>        (function (doc, ...

  8. redis整合spring

    最近公司项目有用到     所以找了一下实例.感觉很清晰.    完整项目路径http://www.cnblogs.com/dennisit/p/3614521.html看了一下应该没问题

  9. IBM Minus One

    IBM Minus One Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total ...

  10. 手机浏览器wap网页点击链接触发颜色区块的问题解决办法

    引子 在做HTML5 WAP网页的时候,一行内容做了2个链接,点击一个标签的时候,整个颜色块会闪一下,影响美观.需求针对这种情况来问我,能否把这个一闪的颜色去掉.我当时就想,这个怎么去?那我也不好直接 ...