总而言之，这就是一篇用来记录我学习前端历程的日志，希望不要断更。
朝着优秀的前端工程师努力吧！
前一周因为写java作业断更了，逊内
HTML标签-图片标签
img标签介绍
img是一个单标签，语法大致如下：
1 | <img src="图片的URL" /> |
- 能够插入的图片类型是：jpg(jpeg)、gif、png、bmp等。
- 不能往网页中插入的图片格式是：psd、ai等。
HTML页面不是直接插入图片，而是插入图片的引用地址，所以要先把图片上传到服务器上。
img标签的src属性
这里涉及到图片的一个属性：
src属性：指图片的路径。
在写图片路径时，有两种写法：相对路径、绝对路径
相对路径
相对当前页面所在的路径，两个标记.和..分别代表当前目录和上一层目录。
例1：
1 | <!-- 当前目录中的图片 --> |
相对路径不会出现：
1 | aaa/../bbb/1.jpg |
../要么不写，要么写在开头。
例2：
1 | <img src="images/1.jpg"> |
上方代码的意思是，当前html页面有一个并列的文件夹images，在文件夹images中存放了一张图片1.jpg
/是虚拟路径 ，在unix（web）中表示目录
\是实际物理路径，在windows系统中表示目录，在unix（web）中表示将特殊字符变成一般字符顺便两种都可以在html中表示路径，
/有自动填充\没有
顺便为避免混淆，在中国开发者开始使用[撇斜杠]和[捺斜杠]来代表
/和\
绝对路径
（1）以盘符开始的绝对路径。such as：
1 | <img src="C:\Users\qianguyihao\Desktop\html\images\1.jpg"> |
（2）网络路径。such as：
1 | <img src="http://img.smyhvae.com/20200122_200901.png"> |
相对路径和绝对路径的总结
相对路径的好处：站点不管拷贝到哪里，文件和图片的相对路径关系都是不变的。
相对路径使用有一个前提：网页文件和你的图片必须在一个服务器上
Q：我的网页在C盘，图片却在D盘，能不能插入？
A：不管是用绝对还是相对路径都不能
Summary
无论是在a标签还是img标签上，如果要用路径，只有两种路径能用，就是相对路径和绝对路径：
- 相对路径从自己出发，找到别人。
- 绝对路径，就是
http://或者https://开头的路径。 - 绝对不允许使用
file://开头的文件，这个是完全错误的！
img标签的其他属性
width、height属性
width：图像的宽度。height：图像的高度。
上面两个属性在HTML5中的单位是CSS像素，在HTML4中既可以是像素，也可以是百分比。可以只限定width和height中的一个值，浏览器会根据原始图像进行缩放。
重要提示：如果要想保证图片等比例缩放，请只设置width和height中其中一个。
alt属性
alt：当图片不可用（无法显示）的时候，代替图片显示的文字。alt是英语 alternate “替代”的意思，代表替换资源。
title属性
title：提示性文本。鼠标悬停时出现的文本。
超链接标签a中也出现过的属性
title 属性不该被用作一幅图片在 alt 之外的补充说明信息。如果一幅图片需要小标题，使用 figure 或 figcaption 元素。
title元素的值一般作为提示条（tooltip）呈现给用户，光标于图片上悬停后显示出来。
尽管这确实能给用户更多的信息，不该假定用户真的能看到：用户可能只有键盘或触摸屏。
如果要把特别重要的信息提供给用户，可以选择上面提供的一种方法将其内联显示，而不是使用title
align属性
- 图片的
align属性：图片和周围文字的相对位置。属性取值可以是：bottom（默认）、center、top、left、right。
如果想实现图文混排的效果，可以使用align属性，取值为left或者right。
1、align=""表示图片和文字底端对齐，即默认情况下的显示效果
2、align="center"表示图片和文字方向上居中对齐
3、align="top"表示图片与文字顶端对齐
4、align="left"图片在文字左边，默认顶端对齐
5、align="right"图片在文字右边（而且好像会跑到页面的最右侧）
其他已废弃的属性
Align（已废弃）：指图片的水平对齐方式，属性值可以是：top、middle、bottom、left、center、right。该属性已废弃，替换为vertical-align这个CSS属性。border（已废弃）：给图片加边框，单位是像素，边框的颜色默认黑色。该属性已废弃，替换为border这个CSS属性。Hspace（已废弃）：指图片左右的边距。Vspace（已废弃）：指图片上下的边距。
