当前位置:首页 > 技术文章 > 正文内容

02.Web大前端时代之:HTML5+CSS3入门系列~H5结构元素

zonemu2个月前 (07-09)技术文章26

Web大前端时代之:HTML5+CSS3入门系列:
http://www.cnblogs.com/dunitian/p/5121725.html

1.结构元素

可以理解为语义话标记,比如:以前这么写<div id="nav"></div> 现在偷懒写:<nav></nav>

1.header头部区域,包含对主页的介绍

<header> 标签定义文档的页眉(介绍信息)

2.nav导航系列 <nav> 标签定义导航链接的部分。

3.section一块区域

<section> 标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分

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

5.aside相关内容 <aside> 标签定义 article 以外的内容。aside 的内容应该与 article 的内容相关

6.footer脚部区域

<footer> 标签定义文档或节的页脚。<footer> 元素应当含有其包含元素的信息。页脚通常包含文档的作者、版权信息、使用条款链接、联系信息等等。您可以在一个文档中使用多个 <footer> 元素。

简单框架搭建:

草图:

补充说明:

header里面的h4,提示信息

Article里面的footer

大纲:

相关文章

崩溃!3 道 React 面试必卡题,吃透稳过金九银十

凌晨三点还在对着 “React 组件为什么重复渲染” 抓耳挠腮?别慌!今天挑出 3 道让 90% 候选人卡壳的高频题,全是大厂面试官挖的 “坑”,手把手教你见招拆招,看完直接装进面试 “弹药库”!先问...

「 VUE3 + TS + Vite 」父子组件间如何通信?

组件之间传值,大家都很熟悉,涉及到 VUE3 +TS 好多同学就无从下手了,所以分享这篇文章,希望看完后提起 VUE3+TS 能够不慌不忙。平时使用的函数如:ref、reactive、watch、co...

10分钟搞定gitlab-ci自动化部署(gitlab ci 配置)

gitlab-ci 是持续集成工具/自动化部署工具,类似 jenkins。持续集成 是将代码集成到共享存储库并尽可能早地自动构建/测试每个更改的实践 - 通常一天几次。概述在编码完成时都会进行打包发布...

HTML5最新版本介绍(“html5”)

HTML5是HTML4.01和XHTML1.0之后超文本标记语言的最新版本,由一群自由思想者设计,最终实现了多媒体支持、交互性、更智能的表单和更好的语义标注。 HTML 5不只是 HTML规范的最新...

最快清除数组空值?分享 1 段优质 JS 代码片段!

本内容首发于工粽号:程序员大澈,每日分享一段优质代码片段,欢迎关注和投稿!大家好,我是大澈!本文约 600+ 字,整篇阅读约需 1 分钟。今天分享一段优质 JS 代码片段,用最简洁的代码清除了数组中的...

基于 Go 泛型实现的工具库推荐(go2 泛型)

大家好,又见面了,我是 GitHub 精选君!今天要给大家推荐一个 GitHub 开源项目 samber/lo,该项目在 GitHub 有超过 9.5k Star,用一句话介绍该项目就是:“ A Lo...