l W3C标准：结构（HTML描绘页面骨架），样式表现（CSS），行为（JS）
l Html(超链接标记文本)，纯文本只能保存文本内容，音频视频都不能。
l 纯文本作为网页后缀html
l 标签：用标签标记一级标题等。
<标签名（如：h1）>
标签有开始也有结束，
<h1>this my firt web</h1>.
l 根标签<\html>（一个页面只有一个根标签），所有内容均写到根标签里面
l 有两个子标签，
<html><head></head><body></body></html>
,head body 兄弟标签
l 标准结构
<!doctype html>
<html>
<head>
<meta character="utf-8" />
<title></title>(显示在网页的标题栏)
</head>
<body>
<!--在这个结构中编写注释-->
<h1>这是我的<font color="red"></h1>
<h2> </h2>
<h3> </h3>
<p>楚河<br />
汉界<br />
</p>
</body>
</html>
l Head标签内容不显示在用户端，设置信息让浏览器看从而帮助浏览器解析
l Body显示用户页面中所有可见内容
l 不希望别人动可以写注释
l 超链接里的字就是tittle
l
<font></font>
设置字体，但一般不建议使用，因为用CSS更好。
l 属性可以用来设置标签，处理内容，在开始标签中添加属性
l
<font color="red" SIZE="1">
SIZE最大是7，因为是表现，可以用css设置，故不赞成使用，标签的两个属性用空格来隔开。
l HTMl有三个版本使用，故需要用doctype来说明网页的版本，复制粘贴。但是我们用,<!doctype html>（全部大写）声明网页按照html5声明，如果不写文档声明，一些浏览器就会进入怪异模式，导致无法显示网页，故一定要写！大小写无所谓。
l 元素就是标签
l 乱码问题NPP，出现原因：计算机根据一定的规则（字符集）来进行编码与解码。产生乱码的原因，编码和解码所采用的字符集不同。
l 有没有一种编码使用全世界？utf-8（无bom格式）称为万国码。
l 在中文系统浏览器中，默认使用GB2312进行解码，（解决方法:浏览器改成unicode解码方式，或用NPP改成GB2312）
l 那么我们用另一种方法：
<meta />
设置网页的原始数据，如字符集，关键字，是一个自结束标签，编写时添加斜杠，并添加属性。浏览器就会知道我要解码需要和你保持一致
l 记事本中的Ansl（是自动编码，记事本在中文系统中使用GB2312），在英文系统中使用ASCll
l 在HTML一共有6级标题标签，显示效果上，h1最大，h6最小（但是我们不关心，因为表现通过css表现出来）关心的是标签的语义化，h1：大标题h2:小标题，h1最重要，表示网页中的主要内容，其余重要性依次降低。而对于搜索引擎，检查完title就立即查看h1,会影响搜索引擎排名，页面中只能写一个h1，写多个浏览器可能判为垃圾网站，一般页面标题标签只使用h1,h2,h3，h3后基本不用
l 段落标签表示内容中的一个自然段，用p表示一个段落，p标签中的文字会独占一行，并且段与段之间有间距，p语义大部分表示文章内容
l Html字符之间即使有很多的空格和回车键也只会当成一个空格来处理
l 在页面中，可以使用br标签来换行，是一个自结束标签,hr也是自结束标签，可以在页面中生成水平线。
l 实体：什么时候用？如果想写ac（家教网站），在
HTML
中一些小于号，大于号的特殊字符是不能直接使用的。需要使用一些特殊的符号来表示（转义字符），&开始；结尾如<
<
>
l < >使用nbsp来代表空格。这样有几个空格就会在页面显示几个空格。
l
<©>
版权符号
l 图片标签使用<img向网页中引入外部图片，br meta hr img也是自结束标签>
<img src=”1.gif” alt=”这里写的是对图片的描述”>
在同一文件夹下直接写文件名，alt属性可以用来描述一个图片，在图片不能显示时的描述。
l 搜索引擎，通过alt属性来搜索图片，如果不写alt属性，网站将不对img进行收录
l Width以及height属性，可以用来修改
<WIDTH=”200px”>
(像素)宽度和高度如果只设置一个，另一个也会等比例调整大小。一般要求公司人员用美工把图片改，不自己设置。
l Src属性配置的是路径，指的是相对路径，一般不会跨盘（“相对”即为当前资源（网页）所在目录的位置）
l 可以用…/来返回目录的上一级，返回几级目录就写几个…/
l 图片的格式问题：JPEG（jpg），支持图片颜色比较多，图片可以压缩，比较小，不支持透明，一般使用jpeg来保存照片 GIF支持的颜色少，只支持简单的透明（只支持颜色透明），支持动态图，支持的颜色少 PNG 支持颜色多，并且支持复杂的透明，不支持动态图，比较全能。实际开发中png用的较多
l 图片的使用原则：效果不一致，使用效果好的。效果一致，使用小的
l Meta 标签使用还可以用来设置网页的关键字，就可以被引擎搜索出来
l
<meta name=”keywords” content”HTML5，JAVASCRIPT”>
name是对content的描述
l 还可以用来指定网页的描述：
<meta name="description" contrnt="（一段话但不是逗号隔开的关键字）">
。描述是一句话，关键词是一个字，网页看不见，是给搜索引擎看的，不会影响引擎排名
l 使用meta做请求的重定向（5s跳转）。
<meta http-equiv=”refresh” content=”5;url=www.baidu.com”/>
5是等待时间
l （x）Html语法的规范 html不区分大小写 ，但是一般使用小写。Html注释不能嵌套
<!--
<!--
-->
-->（这是错的）
l html标签必须结构完整，要么成对，要么是自结束标签
l 浏览器会以最大的善意来理解语句，因此少了
</p>
会加上所有不符合语法规范的内容
l html标签可以嵌套。
<p>今天热天气<font color="red">zhenbut</font><p>
l
<p>今天热天气<font color="red">zhenbut<p></font>
,但是不能采用交叉嵌套方法。
l html属性必须有值，且必须加引号
l 内联框架，用于引入 外部页面（在一个页面中来现实另一个）。
<iframe src="xx"></iframe>
用src写相对路径，但并不推荐使用，因为内联框架的内容不会被搜索引擎检索。width height name（可以为内联框架的方框来设置大小，规则与图片相同）
l 超链接，使用
<a>
来创建超链接
<a href="http://www.baidu.com">超链接</a>
,属性 hred指向跳转地址。
<br>
可以多写。访问过是紫色，直接在当前页面打开超链接，，但是是在当前页面。用属性规定在
<a href="http://www.baidu.com">
target属性可以用来指定打开链接的位置（新网页打开的位置），self表示当前窗口打开，为默认值，blank为两个标签页。如果想在内部打开，就把target属性值设为tom
l center标签中的内容，默认居中，可以把要居中的元素放到center中（同样也是不推荐使用）
l
<a>
中的href属性可以用#来进行替代。如果将链接地址设到#，点击后会自动跳转到当前页面的顶部
l 如果想回到底部某个位置，html中每一个元素都有一个属性（id），可作为标签的唯一标识。
<a id=”abc 随便起” href=”#”>
id属性是不能重复的。
l 我希望跳转到id为bottom元素所在的位置
<a href="#bottom">
l 联系我们是发送电子邮件的超链接，打开后可以打开计算机默认邮件客户端
l
<ahref=“mailto:邮件地址”>
l CSS(层叠样式表)，网页实际是多层的，我们看到的只是上面那一层，可以用浏览器安装tilt插件
l
<p style="(写css代码)">锄禾日当午，汗滴禾下土</p> 。<p style="color:red">锄禾日当午，汗滴禾下土</p> 。<p style="color:red;font-size:20px;">
l 将样式直接编写到style属性中我们成为内联样式，只对当前元素中内容起作用。但是这种内联样式不方便复用，不推荐
l 也可以将css样式 编写到head中style标签里，需要选中（将样式表编写在style标签中，然后通过css选择器选中指定的元素，然后同时为这些元素一起设置样式，方便复用，也可以将表现和结构进一步分离）
p{
color:red;
font-size:40px;
}
这样称为称为内部样式表，只对当前页面起作用，但是我们想要对其他页面也起作用，还可以将样式表编写到外部的css文件中，然后通过link标签将外部css引入到当前页面中，这样外部css的标签将会引用到网页中
<link rel="stlesheet" type="text/css" href="style.css"/>
(前两个是固定值)它是自结束标签。
l 好处：将css样式同一编写到外部样式表中，完全使结构和表现分离，可以使样式表在不同的页面中引用，最大限度使样式复用，可以利用浏览器缓存加快速度，提高用户体验。如果b网页以加载了一个css，而a网页同样需要css，则在加载中不用重新加载
l Css基本语法：
l Style标签中是另一个世界，是css代码，来个
<h1>
肯定不行，写注释要用另一种方法：注释是/*
*/必须写在style标签中，或者是css文件中
l CSS有两部分：选择器加生命块，通过选择器选中页面中指定的元素，并且将声名块的样式应用到对应元素上。声明块紧跟选择器后边，用一对{}括起来，其实是一组一组的名值对结构。在一个声明块中可以写多个声明，用分号隔开。
l Hbiulder把文件部署到内置服务器中，最大程度模拟环境
l 块元素和内联元素：
<div>我是一个<div />
会发现换行，所谓块元素就是独占一行的意思，无论内容是多少也是body的子函数
P br h1 h2 h3也都是独占一行，它们与div都是块元素。
Div没有任何语义，就是一个存粹的块元素，不为里面的字或元素设置任何默认元素，两行之间p有间隔，而div无，主要是用来布局的，分区（网页）
l 内联元素（行内元素）：
<span></span>
l 内联元素的特点是：有多少字，就占多大地，不会占用一整行一行容不下会自动换行
l 常见的内联元素：
<a>< img> <iframe> <span>
l Span也没有任何语义，专门用来选中文字来设置样式，以及方便css选择用来标记。
如：一个文字没有标签，或者说想选中部分来进行涂色，则可以用span
l 块元素主要用来进行页面布局，内联元素主要用来选择文本，一般情况下只使用块元素来包含内联元素，不会用内联包含块。
l
<a>
元素可包含任意的元素，但是除了它本身
l
<p>
元素不可以包含任何其他的块元素
来源：CSDN
作者：_fsocity
链接：https://blog.csdn.net/m0_46490414/article/details/104695192