HTML5+CSS3学习笔记（四）
HTML5的大部分标签已经写完，具体的使用可能说还是得在实践中慢慢摸索。另外，还有一些比较特殊的标签，也经常被使用，属性也比较多，这里拿出来单独说一下，一个是"图像"，另一个是"链接"。
图像
这里分成六个部分，即格式、下载速度、颜色、大小、透明度和动画
格式和下载速度：Web中最广泛使用的图片格式有三个，GIF、PNG、JPEG。JPEG是一种压缩格式的图像，相比而言文件相对较小，在网页中的加载速度也比较快，因而比较常用。PNG支持的色彩更为丰富，同时是一种无损格式，并且支持透明（PNG-32支持alpha透明），像大片纯色的图像，如标识、重复的团、插图以及图像文字都适合，但因为文件比较大，加载速度相对比较慢。GIF很少使用，尽管支持动图。
尺寸：因为电脑的屏幕分辨率有限，像现在1080p的分辨率为1920*1080，图像尺寸过大就会导致滑动条的出现，不利于网页的浏览，所以应该对图像的尺寸进行控制。
透明度：PNG不支持透明度，GIF和JPEG均支持透明度。透明又分为索引色透明（一个像素要么全透明要么不透明）和alpha透明（可以控制每个像素的透明程度），PNG-24只支持索引色透明，而PNG-32只支持alpha透明，通常PNG-32更加的常用。
动画：三种格式里只有GIF支持动画，但已经很少使用，现在通常使用CSS动画、Javascript、HTML5 Canvas、SVG。
语法：
<img src="url">，这是最基本的格式，url是图像存储位置相对于html文件的相对位置。
在此基础上可以进行相应的扩充，比方说增加alt=""属性，当图像无法正常显示的时候，浏览器会把alt里的文本内容显示出来，如果图像对内容的影响不大，alt属性可以留空。
添加title属性，但鼠标停留在图像上时会显示出一行解释文本。
指定图像尺寸：用width="x"和height="y"属性指定图像的宽度和高度，理应小于电脑屏幕的尺寸，收获更好的显示效果。考虑到Retinal屏的广泛使用，这里有个技巧，可以使图像显示效果更好，那就是设置width和height为原始图像尺寸的一半。
为网站添加图标：在浏览器中，图标favicon经常显示在标签页上，尺寸至少应为16px*16px。可以在这个网站http://www.easyicon.net/下载到不同尺寸的ico文件，将图标文件放在根目录里，然后在html文件的head标签里添加这一句<link rel="icon" href="url">，即可。
有些时候会选择将img放置在figure这个标签里，并设置figcaption
链接
链接有两个主要的部分：目标和标签。目标是指跳转到另一个界面，标签是指被触发的部分。
语法：
<a href="url">标签文本</a>，这是最基本的一个链接，链接的文本浏览器会添加一些默认的样式，比如颜色和下划线。
在此基础上可以增加rel="external"属性表明这是一个外部链接，rel属性是用来指定当前文档与被链接文档的关系，属性有很多
同样可以设置title属性，效果与img一样。
target属性，可选，提供的属性值有这么几个，我比较喜欢用_blank，但书上推荐说最好不用这个属性。
创建锚并链接到锚：锚可以帮助用户跳转到页面的不同部分，如顶端，结尾等。创建过程是这样的，在要跳转到的标签里增加id="archor_name"，在要创建链接到锚的链接里将写href="#archor_name"，archor_name可以自己取，一定是唯一的，并且"#"不可或缺。还有一种特殊情况，如果锚在另一个网页中，还可以通过<a href="url#archor_name"，这样就可以链接到另一个页面。
当然也可以创建其他形式的链接，如文件、电子邮件和电话等。
文件：语法格式很简单，就是在href属性里添加文件所在位置的路径和文件名，扩展名不能省略。
电子邮件：这个复杂一些，初始是这样的，href="mailto:name@domain.com"，可以添加很多参数，写第一个参数时要在邮箱地址后面添加一个"?"，再添加参数的话就加上"&"，有这么几个参数。
在网页上点击就会直接弹出本地的邮件程序，像Win10就是如此，根据你添加的参数，会对邮件内容初始化。
如果需要再题目或者内容里添加空格的话，是要写成"%20"的格式，这是浏览器对于空格的编码，不要直接打空格。
电话：href="tel:+国家代码和电话号码"，像中国国家代码是0086，后面跟上电话号码即可。在Chrome中我试了，浏览器会弹出调用外部应用的请求，如Skype，据说在手机端的效果是询问是否拨打电话，这个以后可以尝试。
总结：有关图像和链接，用法都比较固定，没有太多可操纵的空间，因为规则就是如此。有关HTML的部分大致就到这里，下面就是CSS的部分，博客写的比学的要慢，目前已经学了一部分CSS的内容，回头再看，HTML相对还是简单，只需要搭建语义良好的框架，不必管如何表现，但是一个结构清晰的HTML对于写CSS还是有一定的便捷。
