2021.7.13知识总结

1.什么是HTML5？

   HTML5这个词已经产生了一些变化，它代表的已经不再是简单的HTML网页设计标准，而是围绕着HTML这个东西以及他周边的一系列网页相关技术的总称，这其中既包含了HTML+css的网页制作，也包含了JavaScript这门编程语言的相关开发，这就是HTML5。

---

2.HTML5能做什么？

1.网页开发（用的最多的，只要是浏览器能看到的，都需要用到前端）

2.小程序，公众号（微信，支付宝，头条等好多都用前端语言进行开发）

3.Hybrid  App(混合应用开发，手机应用  例如，支付宝，淘宝等)

4.Native App(原生应用开发，例如React Native 等框架的开发）

5.桌面应用开发（电脑软件）

6.游戏开发（例如，微信小游戏，其实好多游戏都可以用前端语言进行编写）

7.后端开发（前端学到的nodejs可以实现后端的开发）

---

3.项目的开发流程是什么？

产品经理          UI设计  

前端

后台开发          测试

---

4.网页的组成部分是什么？

HTML架构 （W3C制定了结构HTML的语法、标准）

css的表现（W3C制定了表现CSS的语法和标准）

JS行为（ECMA制定了行为标准<DOM ECMAScript>）

---

HTML、XHTML、HTML5的区别

1、HTML 指的是超文本标记语言 (Hyper Text Markup Language) www万维网的描述性语言。

2、XHTML指可扩展超文本标记语言（标识语言）（EXtensible HyperText Markup Language）是一种置标语言，表现方式与超文本标记语言（HTML）类似，不过语法上更加严格。XHTML 元素必须被正确地嵌套，XHTML 元素必须被关闭，XHTML标签名必须用小写字母，XHTML 文档必须拥有根元素。

3、HTML5指的是HTML的第五次重大修改（第5个版本）(HTML5 是 W3C 与 WHATWG 合作的结果)，H5网络标准统一，可以跨平台，多设备使用，语义化比较强。

---

5.文件命名规范

文件命名规则：用英文，不建议使用中文 

名称全部用小写英文字母、数字、下划线的组合，其中不得包含汉字、空格和特殊字符；必须以英文字母开头

命名的时候最好使用语义化比较强的英文

---

6.HTML理论基础

1、常规标记、双标记

      <标记  属性=“属性值”  属性=“属性值”>文字内容</标记>

2、空标记、单标记

      <标记  属性=“属性值”  属性=“属性值” />

---

7.HTML相关标签

个数	含义	语法书写和语法
1	文本标题	<h1>文章或者重点标题</h1> <h2>大模块的标题</h2> <h3>小模块的标题</h3>	<h4>标题H4</h4> <h5>标题H5</h5> <h6>标题H6</h6>
2	段落	<p>段落文本内容</p>
3	加粗	<b>加粗的内容</b>	<strong>加粗的内容</strong>
4	倾斜	<i>倾斜的内容</i>	<em>倾斜的内容</em>
5	强制换行	<br/>	水平线	<hr/>
6	上标	<sup></sup>	下标	<sub></sub>
7	特殊符号	&nbsp;  空格    &copy;  版权©   &reg； 商标®

无序列表	有序列表	自定义列表
<ul>       <li>无序列表</li>       <li>无序列表</li> </ul>	<ol  type=”A” start=”4”>       <li>有序列表</li>       <li>有序列表</li> </ol>     type类型    start  开始	<dl>    <dt>可以是文字也可以图</dt>    <dd>相关文字</dd> </dl>

插入图片

<img  src=“图片路径”   title=“鼠标悬停上去之后的提示信息”  alt=“图片不显示之后的提示信息"/>

---

路径分类：绝对路径、相对路径

1、绝对路径

  绝对路径是指文件在硬盘上真正存在的路径。例如“bg.jpg”这个图片是存放在硬盘的“E:\book\网页布局代码\第2章”目录下，那么 “bg.jpg”这个图片的绝对路径就是“E:\book\网页布\代码\第2章\bg.jpg"。

  注意：绝对路径在实际的开发过程中很少去使用，如果使用“E:\book\网页布\代码\第2章\bg.jpg”来指定背景图片的位置，在自己的计算机上 浏览可能会一切正常，但是上传到Web服务器上浏览就很有可能不会显示图片了，绝对路径可以使用“\”或“/”字符作为目录的分隔字符

2、相对路径

      相对路径，就是相对于自己的目标文件位置。

1)当当前文件与目标文件在同一目录下，直接书写目标文件的文件名+扩展名；

<img src="pic4.gif" />

2)当当前文件与目标文件所处的文件夹在同一目录下，写法如下：

    文件夹名/目标文件全称+扩展名；  <img src="img/pic.png“/>

3)当当前文件所处的文件夹和目标文件在同一目录下，写法如下：

    ../目标文件文件名+扩展名；<img src="../小可爱.png" />

---

超链接

<a  href=“路径”  title=“鼠标悬停上去之后的提示信息”  target=“规定在何处打开文档">内容</a>

---

Target属性：规定在何处打开文档。

A.target=“_self“  默认值

B.target=“_blank“  新窗口打开

---

div标签，没有具体含义，用来划分页面的区域，类似生活中看到的警戒线。

---

表格相关属性：

1. 宽度   width

2. 高度   height

3. 边框   border

4. 边框颜色  bordercolor

5. 背景颜色   bgcolor  

6. 文字水平对齐   align= “ left 或 right 或 center ”

7. 文字垂直对齐  valign =“top 或 middle 或 bottom";

8. cellspacing =" 单元格与单元格之间的间距 “ 必须给 table

9. cellpadding=" 单元格与内容之间的空隙 "  必须给table

10、合并单元格属性：

        colspan=“所要合并的单元格的列数”合并列;必须给td

        rowspan=“所要合并单元格的行数”合并行; 必须给td

合并之后需要把多余的单元格删除

---

Colspan=“所要合并的单元格的列数” 必须给td。

---