前端工作者的入门级别就是HTML的相关内容，到底什么是HTML呢？接下来由我，也就是金刚芭比小丸子来为大家介绍一下：
HTML广义上来看就是我们说的网页，你看到的互联网上面的内容都是可以使用HTML标签进行展示的；例如：你的淘宝，京东，搜狐，百度，他们的网站都离不开HTML页面的编写；接下来为你们详细的介绍；
一、什么是网页
网页时以.html文件为后缀名的文件。用户能够看到的所有的页面，全是属于网页，案例(京东：jd.com)；
二、网页的共性
2-1：网页也叫做HTML文件：
HTML是（hyper text markup language）的简写；
2-2：网页中的共性：
主要包括以下几个部分：头部，主体和尾部
2-3：网页的命名规范：
以.html和.htm为后缀名的文件；文件的命名规范：遵循驼峰命名法（大小驼峰）,字母数字下划线混合使用，不能以数字开头；
2-4：网页的构成基本代码样式：
<!doctype html>==声你明文档类型，代表网页的读取使用的是html；
<head >==网页中的头部标签
<meta charset="UTF-8">==声明的是使用什么编码格式
<title>==网页的标题标签<title>
</head>
<body >==网页中的主体标签
</body>
</html>
2-5：网页中的共性：
主要包括以下几个部分：头部，主体和尾部
三、网站与页面的关系
一个网页是由多个页面组成的；需要先建站点，然后分组建文件夹防止不同的文件，然后进行写网页；
站点示意图：
四、扩充知识
4-1：现在主流的浏览器：
IE、FireFox、Opera、Safari、Chrome
4-2：这些浏览器的内核主要是：
渲染引擎和js引擎；
4-3：HTML中的注释：
注释的含义就是：能够让与你开发的工作着看懂你的功能
<!--注释内容-->
4-4：前端页面方向上面：主要分为三层：
html结构层，css样式层，js行为层；
HTML结构层：类似于生活中的我们的人的身体，还可以理解成我们的房子；
CSS结构层：类似于我们自己的衣服，还可以理解成我们房子装修的瓷砖等；
JS行为层：主要是我们的言谈举止，网页中的各种动态效果
五、标签的分类
5-1：双标签：
双标签：有开始有结束的标签，成对儿出现，又叫做封闭性标签
5-2：单标签：
单标签：有开始没有结束的标签，又叫做非封闭性标签；
六、双标签及属性的相关介绍
6-1：超链接标签：a标签
<a>=链接，属性：href,target（取值：_blank，_parent，_self，_top）,title,name；
示例：<a href="链接地址" target="打开方式">这是超链接标签</a>
target的取值：
1)_blank 在新窗口中打开被链接文档。
2)_self 默认。在相同的框架中打开被链接文档。
3)_parent 在父框架集中打开被链接文档。
4)_top 在整个窗口中打开被链接文档
6-2：斜体标签：em标签和i标签
示例：<em>这是第一个斜体标签</em><i>这是第二个斜体标签</i>
6-3：加粗标签：b标签和strong标签
示例：<b>这是第一个加粗标签</b><strong>这是第二个加粗标签</strong>
6-4：下划线标签：u标签
示例：<u>这是下划线标签</u>
6-5：空标签：span标签
示例：<span>这是空白标签</span>
6-6：角标标签：sup上角标标签，sub下角标标签
示例：<sup>这是上角标标签</sup><sub>这是下角标标签</sub>
6-7：段落标签：p标签
示例：<p>这是段落标签</p>
6-8：居中标签：center标签
示例：<center>这是居中标签</center>
6-9：网页中的标题标签：h1-h6标签(hn标签，取值范围为1-6)
示例：<hn>这是段落标签</hn>
网页中的标签特点：
1、自带加粗；
2、自带换行；
3、默认占宽100%；
6-10：字体标签：font标签
示例：<font size="字体大小" face="字体样式">这是字体标签</font>
属性：size：取值范围为1-7;face：字体样式属性
6-11：表格标签：table标签
示例：<table>这是字体标签</table>
属性：下一章节进行相关介绍
6-12：表单标签：form标签
示例：<form>这是字体标签</form>
属性：下一章节进行相关介绍
6-13：有序列表标签：ol标签,li标签
示例：
<ol>
<li></li>
<li></li>
<li></li>
</ol>
属性1：type类型，取值为：type=“A/a/I/i”
属性2：start=“2” 列表的起始项属性； 默认特点：默认是以数字开始的有顺序的列表；默认占宽100%；
6-14：无序列表标签：ul标签,li标签
示例：
<ul>
<li></li>
<li></li>
<li></li>
</ul>
type类型，取值为：type=“none没有/disc实心/circle空心/square方块；” 默认特点：默认是以黑色实心圆点开始的不显示顺序的列表；默认占宽100%；
七、单标签及HTML属性
7-1：图像标签：img标签
<img>==图像标签，属性：src,border,width,height,alt,title；
示例：<img src="图片的地址" width="图片宽度" height="图片高度" border="图片边框" alt="图片未正常加载情况下的提示型文字" title="鼠标放在图片上面的时候提示性文字">
src=“图片的地址”
width=“图片宽度”
height=“图片高度”
border=“图片边框”
alt=“图片未正常加载情况下的提示型文字”
title=“鼠标放在图片上面的时候提示性文字”
alt与title的区别：
alt:图片未正常加载情况下的提示文字，默认情况下不显示，占页面空间
title:鼠标滑过图片时的提示文字，不占页面空间
7-2：换行标签：br标签
7-3：水平线标签：hr标签
示例：<hr width="水平线的宽度" size="水平线的高度" color="水平线的颜色" align="水平线的对齐方式" noshade="水平线的阴影">
7-4：编码格式标签：meta标签
示例：<meta charset="utf-8">
7-5：外部样式表链接标签：link标签
示例：<link rel="stylesheet" href="外部样式表的路径">
八、★★★扩展知识★★★
什么是属性：属性就是对于一个物体的形容：举例子：金刚芭比小丸子：信息如下：
姓名：金刚芭比小丸子
性别：男
年龄：100岁
身高：178
体重：100
住址：北京昌平
以上信息都是对于金刚芭比的描述，这些信息的左侧都是对于金刚芭比小丸子的形容；右侧是对形容的一个具体的取值；
左侧的就相当于属性，右侧的就相当于属性的取值属性值
上述标签如有遗漏还请大家海涵帮忙补充哦；明天继续更新视频内容稍后也会在后面进行上传
扫一扫
790
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
