给驼驼的教程：在网页上显示图片
驼驼在做 CodeCademy 上面的 web dev 教程，并且自己建了一个个人网页。今天驼驼用人人网的照片链接，把个人网页上的照片换成了自己的，但是……
0. 为啥图片全挂了呢？人人网不想让人在别的网站上用人人网相册里的图片，所以用了反盗链技术。你自己看起来是好的，是因为你在同一个浏览器里登录了人人网，而且你有权限看到你自己相册里的图片。但是别人就不一样。我们做网站的时候不仅要让自己此时能看见，也要让任何人在任何时候都能看见才行。
检查自己的图片是否显示正常，你可以另外开一个浏览器 (比如 IE), 或者你可以用 Chrome 的隐身模式 (Ctrl-Shift-n).
所以我们还是老老实实地，把图片也传到 github 上吧！
1. 首先确定好要传的图片是你有权使用的。如果想要用人人网的照片，先右键——另存为到本地，并且给他们简单容易记的名字，比如 1.jpg, 2.jpg, 3.jpg 这么三个。当然，如果图片名字和内容相关就更好了，比如 courant.jpg, flower.jpg... 这样
2. 在你的 wenyingliu.github.io 这个 repo 的文件夹下建一个 images 文件夹，把想要上传的图片移动进去。这个时候你的文件结构应该是这样
3. Sync. 此时你的照片就上传到了 github 上面。
4. 修改你的网页，把图片内容 <img src="....jpg"> 修改成这样
<img src="images/1.jpg">
看明白了吗？此处没有 http, 而是直接用 images/1.jpg, 这就是一个相对路径，引用的是同一个服务器上的文件。如果你的文件位于更深的子目录下，例如 images/a/b/c.jpg, 那么就写 <img src="images/a/b/c.jpg">
5. 把所有图片进行这样的替换，所有图片都可以正常显示啦！
6. 上面引用相对路径的方法不仅适用于图片，也适用于其他资源。比如说其他页面，或者是 css 文件。
例如，我可以建一个文件夹用来放所有的 css 文件，并且把 main.css 移动进去，像这样：
那么，我就需要把 index.html 文件中的这一行
<link rel="stylesheet" href="main.css">
给改成
<link rel="stylesheet" href="css/main.css">