1.关于手机视口viewport

1.各类视口的介绍
布局视口–layout viewport
可视视口–visual viewport
理想视口–ideal viewport

用户在手机上查看网页的过程，其实是缩放和滑动可视视口显示布局视口不同部分的内容（像用放大镜看书，放大镜是可视视口，书是布局视口，布局视口的大小是不会变化的）
可视视口----用户体验差
理想视口----布局视口在同一个设备上的最佳尺寸
理想视口的使用：<meta name="viewport" content="width=device-width"/>
--------------------------------------------------------------------宽度=设备宽度
--------------------------------------------------------------------布局视口宽度，不写为厂商默认值，指定该属性，布局视口为理想视口
百度：<meta name="viewport" content="width=device" minimum-scale=1.0----最小缩放比 maximum-scale=1.0----最大缩放比 user-scale=no----禁止用户缩放/>

2.响应式网站的设计实践原则
2.1渐进增强 or 优雅降级
2.2大屏幕和小屏幕优先适应哪一个
2.3不管设备大小，应该包含相同的内容
根据设备大小不同，显示不同的内容

3.项目结构下的一些文件
3.1比特虫----在线制作icon图标
3.2humans.txt----官方网站，可以写一些开发者故事，很多网站都有，如github https://github.com/humans.txt
3.3editorconfig.org----规范的配置文件
3.4 .gitnore
3.5LICECENSE.txt----协议文件
3.6Readme.md----项目简介，使用方式，使用链接
3.7 CHANGLOD.md----项目每个版本的更新，说明版本号，更新内容，修复了哪些bug

md----markdown文件，在线编辑markdown文件的网站（dillinger.io）
使用说明
#+空格----表示标题一
##+空格----标题二
###+空格----标题三
共有六级标题
>引用的一段名言
[百度(http://www.baidu.com)]----链接
！[百度logo(http://…png)]—图片
-/*表示无序列表
*1.2.3.----*表示有序列表
粗体----双星号，文字加在中间
斜体----单星号，文字夹在中间
粗体加斜体----三个星号，文字夹在中间
表格-----

col	col	col	col
aaa	bbb	ccc	ddd

4.代码的相关知识
4.1ie的条件注释

<!--[if Ite IE8]>
<p>您的浏览器版本过低，请到<a href="http://browsehappy.com">这里</a>更新</p>
<![endif]-->

5.命名方式
class命名方式----中横线 buttoon-alert
js中的命名方式----小驼峰 buttonAlert

6.关于img图片的插入问题
必不可少的图片用img标签插入
可有可无的装饰性图片用标签的style引入，以背景图片的形式

7.ul>li*7
可以用两个类来定义一组列表的样式

class="icon icon-huangyian"
class="icon icon-huangfengping"
icon表示共有的
icon-huangyian表示私有的

8.C3媒体属性简介
width----视口宽度
height----视口高度
device-width----渲染表面的宽度，就是设备屏幕的宽度
device-height----渲染表面的高度,就是设备屏幕的高度
orientation----检查设备处于横向还是纵向
aspect-ratio----基于视口宽度和高度的宽高比，width/height 如16/9,4/3
device-aspect-ratio----渲染表面的宽度，就是设备屏幕的宽度
color----每种颜色的位数 bits 如：min-clolor:16位，8位
resolution----检测屏幕或打印机的分辨率，如 min-resolution:300dpi