前端学习计划2-html基本结构-语意标签-行内标签与块标签

HTML基本结构

html根节点

一般生成的结构自带lang 属性该属性表明编写语言

"en"是代表关于英文内容的

"zh"是代表关于中文内容的

使用en 浏览器检测到使用的是中文，会询问是否翻译

body存放页面主题·

head头部节点

一般存放网页的配置信息，

title标签网页标签页的名字工具栏中的标题，文档的标题，只能在head标签内出现

存放style标签、link标签等等

meta标签，网页配置信息

charset属性表示字符编码

keywords：网站关键字如下图 红色关键字部分

description：用于指定网站描述如下描述部分

http-equiv：http响应头、http文件头，当浏览器请求某个文件时，首先会加载此响应（文件）头内的设置。

通常 http-equiv和content属性名称/值对形式 如下

2秒后跳转到其他页面 第一个数字表示时间单位秒，url后要跳转地址

<meta http-equiv="Refresh" content="2;URL=https://www.baidu.com/">

HTML 语意标签

很少被使用只代表语意并无效果

header标签   :表示网页头部

main标签      :表示网页主体部分，并且只能有一个

footer标签    :表示网页底部

nav标签        :表示网页导航

aside标签     :表示和主体相关其他部分

article标签    :表示一个独立文章

section标签  :表示一个独立的区块，以上全不能表示意义是可用

div      没有语意代表一个区块（常用）

span   没有语意行内元素（常用）

HTML 行内标签与块标签

文档流

行内元素

不独占一行，标签只占自身大小，直到遇到父级边界换行

不支持宽高，内容文本撑开宽高，

不支持上下外边距，但支持左右外边距,

会不正常显示上下内边距，不建议设置内边距行标签

常用于配合p标签实现富文本，富文本是指在一行文字中，文字形式不统一

块元素

独占一行，默认宽度占满父级，

默认高度为零，子级内容撑开高度 在页面中独占一行之上向下垂直排列

行内标签

a、span、br、i、b、sub、sup、em、strong

br标签并不是块标签并不会独占一行

块标签

div、h1-h6、p、ul、ol、artice

问题1，行内标签、块都有哪些

问题2，行内标签、块有哪些区别

问题3，页面基本结构（不重要）