如何理解article标签和aside标签存在的意义

article 和 aside 是 html5 的新标签。前段时间我刚学 html5 ，也是看的视频，刚开始不太明白，后来也想通了。html5 是什么呢？是 html 的升级版，在标签和功能上增强了，说到底还是 html 。html 又是什么呢？html 只是标签，a 就是锚点，p 就是段落，img 就是图片，我们按照这些规定来组织页面，他们本身只是标签，除此之外，没有任何意义，标签的背景颜色是什么，那是 css 的事，标签点击后出现什么效果，那时 js 的事。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 。

最后编辑于：2017.12.05 17:31:02

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 212,029评论 6赞 492
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 90,395评论 3赞 385
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 157,570评论 0赞 348
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 56,535评论 1赞 284
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 65,650评论 6赞 386
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 49,850评论 1赞 290
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 39,006评论 3赞 408
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 37,747评论 0赞 268
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 44,207评论 1赞 303
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 36,536评论 2赞 327
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 38,683评论 1赞 341
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 34,342评论 4赞 330
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 39,964评论 3赞 315
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 30,772评论 0赞 21
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 32,004评论 1赞 266
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 46,401评论 2赞 360
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 43,566评论 2赞 349

如何理解article标签和aside标签存在的意义

推荐阅读更多精彩内容