素材分享网站源码如何自己制作网页
<1>图像标签
在HTML标签中，<img>标签用于定义HTML页面中的图像。
<img src="图像URL" />src是<img>标签的必须属性，它用于指定图像文件的路径名好和文件名
| 属性 | 属性值 | 说明 |
| src | 图片路径 | 必须属性 |
| alt | 文本 | 替换文本。图像不能显示的文字 |
| title | 文本 | 提示文本。鼠标放到图像上，显示文字 |
| width | 像素 | 设置图像的宽度 |
| height | 像素 | 设置图像的高度 |
| border | 像素 | 设置图像的边框粗细 |
图像标签的注意点：
-图像标签可以拥有多个属性，必须写在标签名后面。
-属性之间不分先后顺序，标签名与属性、属性-与属性之间均以空格分开。
-属性采用键值对的格式，即key="value"的格式，属性="属性值"。
<2>目录文件夹和根目录
目录文件夹：就是普通文件，里面只不过存放了我们做页面所需要的素材，比如html文件，图片等。
根目录：打开目录文件夹的第一层就是根目录。
<3>相对路径和绝对路径
3.1相对路径
相对路径：以引用文件所在位置为参考基础，而建立的目录路径。
| 相对路径 | 符 号 | 说明 |
| 同一级路径 | 图像文件位于HTML文件同一级 如<img src="candy.png" /> | |
| 下一级路径 | / | 图像文件位于HTML文件下一级 如 <img src="images/candy.png /> |
| 上一级目录 | ../ | 图像文件位于HTML文件上一级 如<img src="../candy.png /> |
3.2绝对路径
绝对路径：是指在目录下的绝对位置，直接达到目标位置，通常从盘符开始的路径。
例如："D:\web\img\logo.gif"或者完整的网络地址"http://www.itcast.cn/images/logo.gif"。
<4>超链接标签
在HTML中，<a>标签用于定义超链接，作用是从一个页面链接到另一个页面。
4.1超链接的语法格式
单词anchor的缩写，意为：锚。
<a href="跳转目标" target="目标窗口的弹出方式">文本或图像 </a>两个属性的作用如下：
| 属性 | 作用 |
| href | 用于指定链接目标的url地址，（必须属性）当为标签应用href属性，它就具有了超链接的功能 |
| target | 用于指定链接页面的打开方式，其中_self为默认值，_blank为在窗口中打开方式 |
4.2链接的分类
1.外部链接：例如<a herf="http"//www.baidu.com">百度</a>。
2.内部链接：网站内部页面之间的相互链接，直接链接内部页面名称即可，例如<a href="index.html">首页</a>。
3.空链接：如果当时没有确定链接目标时，<a href="#">空链接</a>。
4.下载链接：如果href里面地址是一个文件或者压缩包，会下载这个文件。
5.网络元素链接：在网页中的各种网络元素，如文本、图像、表格、音频、视频都可以添加超链接
<!DOCTYPE html>
<br lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><h4>1.外部链接</h4><a href="http://www.qq.com" >QQ</a><br /><a href="体育新闻.html" target="_blank">体育新闻</a></body><br /><a href="#">空链接</a><br /><a href="前端.zip">前端压缩包(有zip或者exe等压缩包形式)</a><br /><a href="https://www.baidu.com" target="_blank"><img src="前端.png"></a>
</body>
</html>6.锚点链接：点击链接可以快速定位到页面中的某个位置
-在链接文本中的href属性中，设置属性值为 #名字 的形式，如<href="#two">第二集</a>
-找到目标位置标签，里面添加一个id属性=刚才的名字，如:<h3 id = "two">第二集介绍</h3>
<5>HTML中的注释和特殊字符
5.1注释
如果需要再HTML文档中添加一些便于阅读和理解但又不需要显示在页面中的注释文字，就需要使用注释标签。
HTML中的注释以"<!--"开头，以"-->"结束。
即<!-- 注释语句 --> 可以用快捷键：ctrl + /
5.2特殊字符
在HTML页面中，一些特殊的符号很难或者不方便直接使用，此时我们就可以使用下面的字符来替代。
| 特殊字符 | 描述 | 字符的代码 |
| 空格符 | | |
| < | 小于号 | < |
| > | 大于号 | > |
| & | 和号 | & |
| ￥ | 人民币 | ¥ |
| © | 版权 | © |
| ® | 注册商标 | ® |
| ° | 摄氏度 | ° |
| ± | 正负号 | ± |
| x | 乘号 | × |
| ÷ | 除号 | ÷ |
| ₂ | 平方 | ² |
| ³ | 立方 | ³ |
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><!-- 这是一行注释 --><!-- 快捷键为：ctrl + / --> <br /> 这里有 空格<br /> 这里有 两个空格<br />这是大于号>这是小于号<这是等于号=这是双引号"这是单引号'<br />这是反斜杠\这是斜杠/<br />这是和号&<br />¥©®°±×÷²³
</body>
</html>（ps：以上内容基于B站pink老师前端基础课程整理）