html基本属性简概

一、网页基本结构含义

hrml：跟标签、一个页面只有一个根标签所有内容都在根标签内

head标签：里面内容·，用户看不见，给浏览器辅助解析代码

title：网页的标题，出现在网页标题栏中

title的作用是一定程度上帮助浏览器检索页面，帮助推广部门推广网站；推广部门一般情况下分为sem、seo两个部分，sem主要做竞争推广，seo是搜索引擎优化，不花钱推广

body：书写网页主体内容，用户看见的内容都是在bodyy标签内

学习html标签的原则：关注语义，不关注样式、位置

meta，单标签，两种写法：<meta>或<meta/>

主要是配合属性以及对应的属性值，来帮助浏览器解析代码

属性:写在开始标签或者单标签内部

属性值：写在属性后，双引号内部

charset=“属性值”

charset：字符集属性，用来设置编码的语言

utf-8：字符集的种类 -万国码

编码：也就是将字符、图片、音视频等都装换成二进制存起来

解码:将存起来的二进制转换成字符、图片、音视频

乱码：编码和解码用的不是一套密码本，就会出现乱码

lang=“en”：配置代码语言是英文

二、实体

1.什么是实体：在浏览器中，有一些特殊的符号，浏览器提前征用，程序员不可以直接去使用，浏览器是不识别的，如果非要用，程序员需要用另外的一些字符去替代，我们管这些另外的字符就叫做实体

2.实体语法：&实体的语法；

3.常用的实体：&nbsp； :空格 &gt：&lt：大于号小于号 &cop;版权符

写一个网站 最基本:

html结构

css样式

js交互

三、基本标签

1.标题标签h1~h6

语义：用标题标签包裹的内容就是标题

作用：也可以帮助seo部门做推广，语义作用的重要性仅次于title标签，而且h1-h6语义是逐步降低的，h1语义最重，一般情况下，一个页面只有一个h1，常用h1-h3

默认样式：字体有加粗，h1-h6字体逐步减小，标题标签独占一行

行与行之间有较大间隔

2.段落标签：段落标签用于表示内容中的一个自然段

默认样式

特殊的块元素 一般只用来包裹文字或图片，它里面不能放块元素

独占一行，行与行之间有较大间隔

3.hgroup标签用来为标题分组，可以将1一组相关的标题放在hgroup里面；样子上没有区别

4.em标签：强调标签，重要内容，强调

语义：语音语调的一个加重强调

默认样式:字符变斜体，不独占一行

5.strong标签表示强调，内容重要性的强调

默认样式：字符加粗，不独占一行

em、strong的区别

1.默认样式上来看。em字体变斜，strong字体加粗

2.语义：em 语音语调的强调；strong内容重要性的强调

3.一般情况下，我们强调时，这两个标签都用，不做特别的细分

6.blockquote：引用别说的话，长引用，会换行

默认样式：引用话的前面会有间隔

7.q表示短引用

默认样式：加了双引号

8.换行标签br ：强制换行。单标签

9.分割线：hr：当便签

10.使用del标签1表示一个删除的内容（居中下划线）

11.center：居中效果，独占一行

12.div：布局没有意义的元素/标签

13.span：没有语意，用来包裹文字

四、布局标签（结构化标签）

heaser：网页的头部

main：网页的主体部分

footer：网页的底部

一般情况下一个页面只能有一个headr、main、footer

nav：网页的导航

aside:和主体相关的内容，侧边栏

article：文章之类的

section：独立的区块，上面的标签都不合适就用这个

五、元素的分类

元素又叫标签，

1·块元素：主要是用来布局

特点：1.会独占一行

2.块元素的默认宽度是父元素的100%

3.块元素的高度由内容撑开

常用块元素：h1~h6，p，div，header，main，footer，nav...

2.行内元素：主要用来包裹文字

特点：1.不会独占一行

2.行内元素由内容撑开不能设置宽

常用行内元素：span，em，stroog，a...

3.行内块元素：

1. 既有块元素的特点也有行内元素的特点

2. 不会独占一行，可以设置宽高

display：实现不同元素的相互转换

可选值：

none：隐藏元素

block：转换成块元素

inline：转换成行内元素

linline-block：转换成行内块元素

使用元素和块元素布局时的注意点

1. 块元素是布局元素，里面什么都能放

2. 行内元素，一般用来包裹文字，不能放块元素

3. 特殊的块元素：p：不能放块元素，只能放文字图片

                              a：不能放另一个a标签

六、列表及img标签

1.有序列表：

默认样式：每项列表前默认加了项目符号，默认的项目符号是1.2.3.4...

2.无序列表：有项目符号，项目符号默认样式是小圆点

3.定义列表：用dl标签创建.

注意：1.列表之间可以相互嵌套列表

2.可以使用type属性更改项目符号

3.默认样式，li有项目符号，上下左边都有间隔

图片标签

使用img标签来向网页中引入一个外部图片，

img标签也是一个自结束标签（单标签）

img在这种元素属于替换元素（基于块和行内元素之间，具有两种元素特点）

src 引入图片的路径

1.绝对路径：无论你的html文件在哪里，只要写对地址，图片肯定你引进来

相对路径：写的路径地址和你的html文件位置有关

alt： 对图片的描述，帮助浏览器收录图片，有一定seo效果

当图片引入不成功的时候，alt属性就会出现

只需要设置宽度或者高度，图片会自适应调整