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

news2024/11/9 3:42:30

Web大前端时代之:HTML5+CSS3入门系列:Web大前端时代之:HTML5+CSS3入门系列 - 毒逆天 - 博客园

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

大纲:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/624212.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

JavaWeb笔记_SpringBoot原理

JavaWeb笔记_SpringBoot原理 配置优先级Bean管理获取BeanBean作用域第三方Bean SpringBoot原理自动配置原理ComponentScan组件扫描Import导入源码跟踪Conditional自定义starter创建aliyun-oss-spring-boot-starter模块创建aliyun-oss-spring-boot-autoconfigure 来源 配置优先级…

opencv、dlib、paddlehub人脸检测

opencv、dlib、paddlehub检测效果对比。dlib和paddlehub的效果相对好一点。 说明&#xff1a;本文只做人脸检测不识别&#xff0c;找识别的不用看本文。 ## 部署说明 # 1. 安装python或conda # 2. 安装依赖&#xff0c;pip install -r requirements.txt # 3. 192.168.1.41 修…

Docker 基本使用

安装 Linux安装 # 1、查看当前Linux系统版本 Linux系统版本需要>3.0 [rootzjrs_test2_152 ~]# uname -a Linux zjrs_test2_152 3.10.0-957.el7.x86_64 #1 SMP Thu Nov 8 23:39:32 UTC 2018 x86_64 x86_64 x86_64 GNU/Linux [rootzjrs_test2_152 ~]# uname -r 3.10.0-957.el…

Baumer工业相机堡盟工业相机如何使用BGAPI SDK控制相机数据流的开启和关闭(C#)

Baumer工业相机堡盟工业相机如何使用BGAPI SDK控制相机数据流的开启和关闭&#xff08;C#&#xff09; Baumer工业相机Baumer工业相机BGAPI SDK的技术背景Baumer工业相机使用BGAPISDK控制相机数据流的方式1.引用合适的类文件2.使用BGAPISDK控制相机数据流的方式2.使用BGAPISDK控…

AOP--@DeclareParents--引入新功能

目录 引入 解析 示例 引入 Java不是动态语言&#xff1b;一旦类编译完成了&#xff0c;我们就很难再为该类添加新的功能了切面能够为现有的方法增加额外的功能&#xff0c;为什么不能为一个对象增加新的方法呢&#xff1f;实际上&#xff0c;利用被称为引入的AOP概念&#x…

从数据开始,构建值得信赖的生成式AI应用

生成式AI有望从根本上打开新世界机遇的大门&#xff1a;从能够个性化回复的对话式聊天机器人&#xff0c;到各种应用的代码&#xff0c;再到营销传播的定制化内容......生成式AI正在彻底改变企业的运作方式。越来越多的领先企业正在构建可信的生成式AI应用&#xff0c;让它们在…

信息共享、管理协作!工程劳务管理模板让企业内部更加通畅

随着建筑行业的快速发展&#xff0c;工程劳务管理变得越来越复杂&#xff0c;同时企业也需要更加高效地管理劳务人员的信息、工资、考勤等方面。因此&#xff0c;工程劳务管理系统应运而生&#xff0c;帮助企业解决这些问题。作为一款低代码开发平台&#xff0c;百数根据市面上…

面向 MSP 的IT管理

MSP&#xff08;管理服务提供商&#xff09;是通过建立自己的网络运作中心(NOC&#xff0c;Network Operating Center)来实施管理服务的。用户的网络通过WAN与MSP的NOC相连&#xff0c;并使用加密技术保证信息在网络上的传输安全。通过NOC&#xff0c;MSP可以实现远程的管理、实…

LVS负载均衡群集----DR部署

文章目录 一、数据包流向分析二、DR模式的特点三、LVS-DR中的ARP问题四、LVS单网段DR模式部署第一步配置负载调度器第二步设置两台节点服务器第三步设置DR 服务器第四步在本地查看调度服务器 一、数据包流向分析 &#xff08;1&#xff09;客户端发送请求到 Director Server&a…

前后端 java 对接海康威视监控-hls实现h5播放

海康的获取监控预览流的接口当中支持 rtsp、rtmp、hls等协议。 这篇文章主要是说hls协议的。 贴上海康的开发平台地址&#xff0c;其中有对应的API&#xff1a;海康开发平台 1、java层面代码 这里除了main方法之外&#xff0c;有两个方法&#xff0c;分别是&#xff1a; 1&am…

【Python】一文教你如何使用 Requests 库

作者主页&#xff1a;爱笑的男孩。的博客_CSDN博客-深度学习,活动,python领域博主爱笑的男孩。擅长深度学习,活动,python,等方面的知识,爱笑的男孩。关注算法,python,计算机视觉,图像处理,深度学习,pytorch,神经网络,opencv领域.https://blog.csdn.net/Code_and516?typeblog个…

审视自己再出发,在职读研从人民大学与加拿大女王大学金融硕士项目起航

有人说&#xff0c;人生并非一帆风顺。是的&#xff0c;在人生的道路上&#xff0c;总会出现各种各样的麻烦。或者认真学习不见成效&#xff0c;或是努力工作得不到赏识。人生中最困难的事情就是审视自己&#xff0c;当我们意识到自己需要提升时&#xff0c;往往是拥有强大能量…

【Linux】线程分离和线程互斥

终于到线程互斥了~ 文章目录 前言一、线程分离 如何理解线程库和线程ID二、线程互斥总结 前言 在上一篇文章中我们学习了线程控制&#xff0c;比如创建一个线程&#xff0c;取消一个线程以及等待线程&#xff0c;这篇文章我们讲两个非常重要的概念&#xff0c;一个是线…

CDH 之 hive 升级至 hive-3.1.3 完美踩坑过程

一、准备工作 1.1 前言 这是博主在升级过程中遇到的问题记录&#xff0c;大家不一定遇到过&#xff0c;如果不是 CDH 平台的话&#xff0c;单是 hive 服务升级应该是不会有这些问题的&#xff0c;且升级前博主也参考过几篇相关 CDH 升级 hive 服务的博文&#xff0c;前面的升级…

go语言操作以太坊智能合约

操作中要注意版本问题 geth版本、golang版本等 在remix环境中写好合约后&#xff0c;进行编译得到abi文件 简单举例 Hello.sol合约 // SPDX-License-Identifier: MIT pragma solidity ^0.8.0;contract Hello {string Msg;function setMsg(string memory _msg) public{Msg_msg…

SM2密码算法规范介绍

目录 1、SM2的密钥对 1.1、SM2公钥 1.2、SM2私钥 2、密钥数据格式 2.1、 GMT0009 2.2、 GMT0016 2.3、 GMT0018 3、加密数据格式 3.1、GMT0009 3.2、GMT0016 3.3、GMT0018 4、签名数据格式 4.1、GMT0009 4.2、GMT0016 4.3、GMT0018 1、SM2的密钥对 1.1、SM2公钥…

java版DVD影碟片出租赁系统C/S模式 java电影购票系统课程设计

系统采用c/s架构&#xff0c;当然&#xff0c;你可以服务端、客户端都在同一台电脑上运行&#xff1b; 也可以在同一局域网内服务端、客户端在其它不同电脑上运行&#xff1b; 如果你有云服务器&#xff0c;可将Service端代码部署至云服务器上&#xff0c;客户端在任何一台有…

不愧是阿里P8出手的并发编程笔记!颠覆了我以往“正确“的认知

对于一个Java程序员而言&#xff0c;能否熟练掌握并发编程是判断他优秀与否的重要标准之一。因为并发编程是Java语言中最为晦涩的知识点&#xff0c;它涉及操作系统、内存、CPU、编程语言等多方面的基础能力&#xff0c;更为考验一个程序员的内功。 那到底应该怎么学习并发编程…

浅析给水管网动态水力建模数据及其管理

摘要&#xff1a;给水管网在城市生产及生活中发挥着十分重要的作用&#xff0c;所以&#xff0c;保证其正常运行便显得尤为必要了。本文将基于给水管网动态水力建模数据及其管理展开相应的分析&#xff0c;以期促进城市给水管网运行质量的提高&#xff0c;为同行提供一些有益的…

HTML4

前序知识 认识两位先驱 计算机基础知识 计算机俗称电脑&#xff0c;是现代一种用于高速计算的电子计算机器&#xff0c;可以进行数值计算、逻辑计算&#xff0c;还具有存储记忆功能。计算机由 硬件 软件组成 C/S架构与B/S架构 上面提到的应用软件&#xff0c;又分为两大类…