1. Doctype
    1. SGML(Standard Generalized Markup Language)
    2. DTD(Document Type Definition)
    3. 渲染模式
      1. 标准模式
      2. 怪异模式
        1. IE盒模型缺陷
      3. 接近标准模式
  2. 常用标签
    1. div
    2. h1~h66, p, span, strong, em...
    3. ul, li, ol, dl, dt, dd
    4. form表单相关
    5. table表格相关
    6. img, canvas
    7. a
  3. iframe
    1. 自适应
    2. 跨域
  4. 空元素
    1. 知名的空元素: <br> <hr> <img> <input> <link> <meta>
    2. 鲜为人知的是: <area> <base> <col> <command> <embed> <keygen> <param> <source> <track> <wbr>
  5. 内联元素与块级元素
    1. 块级元素(block)特性
      1. 总是独占一行,表现为另起一行开始,而且其后的元素也必须另起一行显示;
      2. 宽度(width)、高度(height)、内边距(padding)和外边距(margin)都可控制;
      3. a b span img input select strong
    2. 内联元素(inline)特性
      1. 和相邻的内联元素在同一行;
      2. 宽度(width)、高度(height)、内边距的top/bottom(padding-top/padding-bottom)和外边距的top/bottom(margin-top/margin-bottom)都不可改变,就是里面文字或图片的大小;
      3. div ul ol li dl dt dd h1 h2 h3 h4…p
  6. 优雅降级和渐进增强
    1. 优雅降级(graceful degradation)
      1. 一开始就构建站点的完整功能,然后针对浏览器测试和修复)
      2. 针对那些最高级、最完善的浏览器来设计网站
      3. 将那些被认为“过时”或有功能缺失的浏览器下的测试工作安排在开发周期的最后阶段
      4. 测试对象限定为主流浏览器(如 IE、Mozilla 等)的前一个版本
    2. 渐进增强(progressive enhancement)
      1. 一开始只构建站点的最少特性,然后不断针对各浏览器追加功能)
      2. 认为应关注于内容本身
  7. cookies,sessionStorage 与 localStorage 的区别
    1. cookie在浏览器和服务器之间来回传递,其他不会。
    2. sessionStorage和localStorage有更丰富的接口。
    3. sessionStorage和localStorage有各自独立的存储空间。
  8. meta
    1. SEO优化
      1. 页面关键词
        1. <meta name="keywords" content="your tags" />
      2. 页面描述
        1. <meta name="description" content="150 words" />
      3. 搜索引擎索引方式
        1. <meta name="robots" content="index,follow" />
      4. 页面重定向和刷新
        1. <meta http-equiv="refresh" content="0;url=" />
      5. 其他
        1. <meta name="author" content="author name" /> <!-- 定义网页作者 -->
        2. <meta name="google" content="index,follow" />
        3. <meta name="googlebot" content="index,follow" />
        4. <meta name="verify" content="index,follow" />
    2. 移动设备
      1. viewport
        1. width:宽度(数值 / device-width)(范围从200 到10,000,默认为980 像素)
        2. height:高度(数值 / device-height)(范围从223 到10,000)
        3. initial-scale:初始的缩放比例 (范围从>0 到10)
        4. minimum-scale:允许用户缩放到的最小比例
        5. maximum-scale:允许用户缩放到的最大比例
        6. user-scalable:用户是否可以手动缩 (no,yes)
      2. WebApp全屏模式
        1. <meta name="apple-mobile-web-app-capable" content="yes" /> <!-- 启用 WebApp 全屏模式 -->
      3. 隐藏状态栏/设置状态栏颜色
        1. <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
      4. 添加到主屏后的标题
        1. <meta name="apple-mobile-web-app-title" content="标题">
      5. 忽略数字自动识别为电话号码
        1. <meta content="telephone=no" name="format-detection" />
      6. 忽略识别邮箱
        1. <meta content="email=no" name="format-detection" />
    3. 网页相关
      1. 申明编码
        1. <meta charset='utf-8' />
      2. 优先使用 IE 最新版本和 Chrome
        1. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
        2. <!-- 关于X-UA-Compatible -->
        3. <meta http-equiv="X-UA-Compatible" content="IE=6" ><!-- 使用IE6 -->
        4. <meta http-equiv="X-UA-Compatible" content="IE=7" ><!-- 使用IE7 -->
        5. <meta http-equiv="X-UA-Compatible" content="IE=8" ><!-- 使用IE8 -->
      3. 浏览器内核控制
        1. <meta name="renderer" content="webkit|ie-comp|ie-stand">
      4. 禁止浏览器从本地计算机 的缓存中访问页面内容
        1. <meta http-equiv="Pragma" content="no-cache">
      5. Windows 8
      6. 站点适配:主要用于PC -手机页的对应关系
        1. <meta name="mobile-agent"content="format=[wml|xhtml|html5]; url=url">
      7. 转码申明
        1. <meta http-equiv="Cache-Control" content="no-siteapp" />
  9. 条件注释 (针对IE)
    1. 下层显示 (downlevel revealed)
      1. <![if expression]> HTML <![endif]>
    2. 下层隐藏 (downlevel hidden) 忽略不支持条件注释
      1. <!--[if expression]> HTML <![endif]-->
    3. 运算符:!,lt,lte,gt,gte,(),&,|
  10. HTML 事件属性
    1. Window 事件属性
    2. Form 事件
    3. Keyboard 事件
    4. Mouse 事件
    5. Media 事件
  11. HTML 全局属性
    1. accesskey
      1. 规定激活元素的快捷键
    2. class
      1. 规定元素的一个或多个类名(引用样式表中的类)
    3. dir
      1. 规定元素中内容的文本方向
    4. id
      1. 规定元素的唯一 id
    5. lang
      1. 规定元素内容的语言
    6. style
      1. 规定元素的行内 CSS 样式
    7. tabindex
      1. 规定元素的 tab 键次序
    8. title
      1. 规定有关元素的额外信息
  12. src与href的区别
    1. src(source)
      1. 替换元素
      2. script,img
    2. href(Hypertext Reference)
      1. 建立与外部资源的联系
      2. link,a,