全程软件测试（八十三）：HTML语言基础知识必备—读书笔记
HTML（英文Hyper Text Markup Language的缩写）中文译为“超文本标签语言”，主要是通过HTML标签对网页中的文本、图片、声音等内容进行描述。
1 HTML骨架格式
日常生活的书信，我们要遵循共同的约定。
同理：HTML 有自己的语言语法骨架格式：
</span><span id="39f0e444-06ab-4272-9267-79457537f77d" style="font-size:18px;margin:20px 0px;text-align:left;"> - html结构：包括head body
- html标签是以尖括号包围的关键字
- html标签通常是成对出现的，有开始就有结束，包含成对标签、独立标签
- html通常都有属性，格式：属性名＝“属性值”(多个属性之间空格隔开)
- html标签不区分大小写,建议小写
2 html基本标签
- HTML标签
作用：所有HTML中标签的一个根节点。
- head标签
作用：用于存放：title,meta,base,style,script,link
注意：在head标签中我们必须要设置的标签是title
- title标签
作用：让页面拥有一个属于自己的标题。
- body标签
作用：页面在的主体部分，用于存放所有的HTML标签：p,h,a,b,u,i,s,em,del,ins,strong,img
3 颜色的表示方式
- color:文本的颜色
- bgcolor:背景色
- background:背景图片
第一种方式：使用颜色名称: 仅仅有16种颜色名可用英文字母，其余的要用16进制值。
aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow第二种方式：RGB模式
第三种：十六进制
#000000#ffffff#325687#3774054 文档类型（重点）
这句话就是告诉我们使用哪个html版本， 我们使用的是 html 5 的版本。 html有很多版本，那我们应该告诉用户和浏览器我们使用的版本号。
标签位于文档的最前面，用于向浏览器说明当前文档使用哪种 HTML 或 XHTML 标准规范，必需在开头处使用标签为所有的XHTML文档指定XHTML版本和类型，只有这样浏览器才能按指定的文档类型进行解析。
5 HTML标签的语义化（重点）
所谓标签语义化，就是指标签的含义。
为什么要有语义化标签：方便代码的阅读和维护，同时让浏览器或是网络爬虫可以很好地解析，从而更好分析其中的内容，使用语义化标签会具有更好地搜索引擎优化
核心：合适的地方给一个最为合理的标签。
语义是否良好：当我们去掉CSS之后，网页结构依然组织有序，并且有良好的可读性，不管是谁都能看懂这块内容是什么。
遵循的原则：先确定语义的HTML ，再选合适的CSS。
6 总结：（重要知识点）
- 双标签
<html>html><head>head><title>title><body>body><table>table><tr>tr><td>td><span>span><p>p><form>form><h1>h1><h2>h2><h3>h3><h4>h4><h5>h5><h6>h6><object>object><style>style><b>b><u>u><strong>strong><i>i><div>div><a>a><script>script><center><center>- 单标签
![]()
- 排版标签
1.注释标签：<!–注释–>-------------------------------------
2.换行标签：<br/>-------------------------------------
3.段落标签：<p>文本文字
特点：段与段之间有行高
属性：align对齐方式
(left：左对齐 center：居中 right：右对齐)
-------------------------------------
4.水平线标签:<hr/>属性:
width：水平线的长度(两种:第一种:像素表示；第二种，百分比表示)
size: 水平线的粗细 (像素表示，例如：10px)
color: 水平线的颜色
align:水平线的对齐方式(left：左对齐 center：居中 right：右对齐)
-------------------------------------
5.容器标签（重点）<div>:块级标签，独占一行，换行<span>:行级标签，所有内容都在同一行作用<div>:主要是结合css页面分块布局<span>:进行友好提示信息- 标题标签 (熟记)
为了使网页更具有语义化，我们经常会在页面中用到标题标签，HTML提供了6个等级的标题，随着数字增大文字逐渐变小，字体是加粗的，内置字号，默认占据一行；
<h1>、<h2>、<h3>、<h4>、<h5>和<h6>- 列表标签
容器里面装载着文字或图表的一种形式，叫列表。列表最大的特点就是 整齐 、整洁、 有序
无序列表 ul （重点）
无序列表标签：<ul>ul>属性：type :三个值，分别为：
circle(空心圆) ,disc(默认,实心圆),square(黑色方块)
列表项：<li>li>注意：<ul>ul>中只能嵌套<li>li>，直接在<ul>ul>标签中输入其他标签或者文字的做法是不被允许的。<li>与li>之间相当于一个容器，可以容纳所有元素。
无序列表会带有自己样式属性，放下那个样式，一会让CSS来！有序列表 ol
有序列表标签：<ol>属性：type：1、A、a、I、i（数字、字母、罗马数字）
列表项：<li>li>定义列表dl
\dl><dt>名词1<dd>名词1解释1<dd>名词1解释2
…<dt>名词2<dd>名词2解释1<dd>名词2解释2
…dl>dl>
名词1
名词1解释1
名词1解释2
... 名词2
名词2解释1
名词2解释2
...- 图片标签
独立标签
属性:src：图片地址： 相对路径 （同一个网站） 绝对路径 （不同网站）width:宽度height:高度border:边框align:对齐方式，代表图片与相邻的文本的相当位置（有三个属性值：top middle bottom）alt:图片的文字说明hspace 和 vspace 设定图片边沿上下左右空白，以免文字或其它图片过于贴近链接标签
超链接可以是文本，也可以是一幅图像，您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。（不仅可以创建文本超链接，在网页中各种网页元素，如图像、表格、音频、视频等都可以添加超链接）
属性：href:跳转页面的地址(跳转到外网需要添加协议)；name:名称，锚点(回到锚点: 顶部，底部，中间)，在访问锚点的书写格式:#name的值target:_self(自己) _blank(新页面，之前页面存在) ___parenttop 默认self_search相等于给页面起一个名字，如果再次打开时，如果页面存在，则不再打开新的页面。可以是任意名字。如果当时没有确定链接目标时，通常将链接标签的href属性值定义为“#”(即href=”#”)，表示该链接暂时为一个空链接。
