马上注册，结交更多好友，享用更多功能^_^
您需要 登录 才可以下载或查看，没有账号？立即注册
x
本帖最后由 不二如是 于 2019-4-17 09:42 编辑
万众瞩目的 零基础入门学习Web开发（H5&C3）开始更新了！！！ 
在Web新纪元 |【鱼C#视频课程】剧透这个系列的诞生，时间总是善待任何想拿它搞事情的存在体。
很幸运，一切就这样开始了，开局总会有些不足，但一切在慢慢变好，不是吗？
作为，吹水阁中最爱吹水（爱干无意义事情）的鱼油，整套教程的亮点（槽点）由我来承包～
关注本系列推送（最下方有订阅方式）的鱼油，会享受到一个福利：
会比正常推送，早一个时间节点，看到还未出炉的美味课程
哈哈，废话不多说了， #敲黑板时刻！ 
课程思维导图
1、语义化
上一讲我们了解了最新的语义话结构元素，本讲小甲鱼老师结合苹果官网将重要的元素进行了深入讲解。
2、section 元素
首先是MDN的一则Waring：
翻译：
如果元素内容可以分为几个部分的话，应该使用 <article> 而不是 <section>。
不要把 section 元素作为一个普通的容器来使用，这是本应该是<div>的用法。
一般来说，一个 <section> 应该出现在文档大纲中，意味着要有“标题”
而且 section 可以相互嵌套，浏览器渲染会根据层级关系自动修改标题大小：<section>
<h1>Section.1</h1>
<p>我爱FishC</p>
<section>
<h1>Section.2</h1>
<p>我爱FishC</p>
<section>
<h1>Section.3</h1>
<p>我爱FishC</p>
</section>
</section>
</section>
结构简单，section 中往往就是标题+文本。
3、article 元素
article 元素表示文档、页面、应用或网站中的独立结构，其意在成为可独立分配的或可复用的结构。
article 是一个特殊的 section 元素，它比section具有更明确的语义, 它代表一个独立的、完整的相关内容块。
当 article 元素嵌套使用时，则该元素代表与外层元素有关的文章。
例如，代表咱们论坛帖子评论的 article 元素可嵌套在代表帖子文章的 article 元素中。
article 元素结构比 section 更复杂：<article>
<header>
<h1>标题</h1>
<p>发表日期：<time pubdate="pubdate">2010/10/10</time></p>
</header>
<p>article的使用方法</p>
<footer>
<p><small>Copyright @ yiiyaa.net All Rights Reserverd</samll></p>
</footer>
</article>
这也算是二者的区别所在，更多阅读：实用Tips - 47 - div、section、article的区别
4、details + summary 元素
details+summary 元素可创建一个组件，仅在被切换成展开状态时，它才会显示内含的信息。
summary 元素可为该部件提供概要或者标签，代码： <details>
<summary>语义</summary>
HTML5的核心之一就是语义为王！
</details>
通过为 details 元素添加 open 属性可以默认展开内容。
课后作业，完成了吗？
传送门
如果有收获，别忘了评分 ：
这位鱼油，如果喜欢本系列学习笔记，请订阅 专辑☞（ 传送门）（ 不喜欢更要订阅 ）
| 
( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)
狗仔卡
发表于 2019-4-8 10:19:00
置顶卡
千斤顶
显身卡
发表于 2019-4-8 10:23:11
发表于 2019-4-8 23:33:05
