HEAD FIRST HTML NOTE
<!doctype html>html文档开头标注，表明支持最新html规范和标准，可以理解为活的标准，由万维网协会W3C维护，可以向下兼容；任何时候都要使用，除非你确实在写HTML4.01或XHTML
<meta charset="utf-8">在head中设置页面字符编码，一般都要指明
<em></em>强调
<del></del>为文本加删除线
<ins></ins>为文本加下划线
<a></a>建立链接
<a href = "https://www.google.com">谷歌<a>
<a target=“_blank” href = "https://www.google.com" title="搜索">谷歌<a>
其中的title是给出链接提示信息，也可应用在其他属性中
target属性告诉浏览器在哪里打开href属性中的链接，其中_blank表示在新窗口中打开
<h2 id="Cofee">Coffee</h2>
为属性添加id进行页面唯一标识
可通过在链接后面添加 /#id 来跳转到指定页面位置
<a href="#top">Back to top</a>返回到当前页面顶部
<strong></strong> 强调加粗
<q></q>短引用
<blockquote></blockquote>长引用
- 块元素
<h1> <h2> ... <h6> <p> <blockquote> <ol> <li>...
显示时前后各有一个空行
特立独行 - 内联元素
<q> <a> <em> <img>...
在页面文本流中总在“行内”出现
随波逐流
br换行 ——void元素(没有内容和结束标记的元素)
<li></li>列表项 list item
<ol></ol> 有序列表 ordered list
<ul></ul> 无序列表 unordered list
<ol>和<li>（或者ul和li）要一起使用，离开彼此没有意义，
列表就是一组列表项：
<li>元素用来表示每个元素
<ol>或<ul>元素把它们归为一组
-
字符实体（供特殊字符使用，总是以&开头）
>:>
<:<
&:&
©right;:©right;版权实体 -
img元素
<img src="图片地址">
考虑到每个浏览器加载图片的方式和速度问题，或当某些情况无法加载图片时，做好如下说明图片信息方案：
<img src="图片地址" alt=“描述图片文字”>
自定义图片的宽度和高度(使用像素数指定)
<img src="图片地址" width="48" height="100">
为图像添加链接
<a href="链接的页面地址"> <img src="图片地址" alt=“描述图片文字”> </a>
下面为web端常用的三种图像格式优劣比较
| 种类 | JPEG | PNG | GIF |
|---|---|---|---|
| 格式 | 有损 | 无损 | 无损 |
| 颜色 | 1600万 | PNG-8(2^8种)/PNG-24/PNG-32 | 256种 |
| 透明度 | 不支持 | PNG24不支持，8和32支持 | 支持(只允许设置一种颜色) |
| 大小 | 较小 | 比jpg大 | 比jpg大 |
| 动画 | 不支持 | 不支持 | 支持 |
| 适用 | 保存照片和其他复杂图像 | 保存logo和其他包含单色、线条或文本的简单图形 | 同PNG |
须知
-
一定要以<doctype>开头
每个页面都要从一个doctype开始，这样才能让浏览器和验证工具顺利开展工作；
任何时候都要使用，除非你确实在写HTML4.01或XHTML； -
<html>元素：不能没有它
紧接着doctype，<html>元素必须是web页面的最顶层元素或根元素。所以，在doctype后面，由<html>标记开始页面，</html>标记结束页面，页面中的所有其他内容都嵌套在这个元素中。 -
要使用<head>和<body>编写更好的HTML
只有<head>和<body>元素能直接放在<html>元素中。这说明，所有其他元素都必须放在<head>或<body>元素中，没有例外！ -
在<head>中指定正确的字符编码
在<head>中包含一个<meta charset="utf-8">标记。浏览器会感谢你，用户在你的博客上阅读世界各地用户发表的评论时，也会因为你指定了正确的字符编码而感谢你。 -
没有<title>的<head>算什么
一定要在<head>元素中包含一个<title>元素。这是必须的。如果没有，则会得到不符合标准的HTML。只能在<head>元素中放置<title>、<meta>和<style>元素。 -
嵌套某些元素时要当心
不要把<a>元素嵌在另一个<a>元素中，因为这样会让访问者很迷惑。另外，不允许在<img>等void元素中嵌套其他的内联元素。 -
检查属性
有些元素属性是必要的，有些则是可选的。如果<img>元素没有<src>属性，就没有意义，alt属性也是必要的。
