移动端布局解决方案 --- 简洁而不简单
hotcss不是一个库，亦不是一个框架。通俗点讲，这是一个解决方案。用于解决移动端布局中遇到的单位等问题。
hotcss遵循视觉一致性原则，即不同屏幕下页面比例是一致的，同时hotcss不提倡使用在跨设备的开发中（当然不提倡和不可以是两个概念）。
另外，为了辅助开发hotcss提供了gulp编译，可查看如何编译
提供一个演示示例。进入src/test/，使用bower安装hotcss即可体验。
hotcss不需要你再手动设置viewport，她会根据当前环境计算出最适合的viewport。- 在使用
hotcss的过程中，所有的单位应该使用px2rem，无论css中还是JS中。 - 上述提到的
所有的单位并不准确，如果你需要解决移动端1px这个世纪难题，则可以直接写1px，而无需使用px2rem。并且，这个1px在所有设备中是真的1px。 - 同时
hotcss支持单项目多设计图（设计图尺寸不一样），只需要在你的css中定义设计图尺寸即可
可以使用bower或者npm来安装hotcss。
bower install hotcss --save
npm install hotcss --save
如果你不乐意使用这两种方法，也可以直接复制源码或者使用git clone等你喜欢的方式。
引入hotcss.js，该JS必须在<body>前加载，如果能内嵌到HTML中，效果更好。当然这个JS是非常小的，只有区区几行，压缩后更是不值一提，建议使用内嵌方式直接写到<head>里面。
<!-- /index.html-->
<script src="../bower_components/hotcss/dest/hotcss.js"></script>注意事项:
- 不能将此JS放到
<body>后加载，或者异步加载。这样会导致加载完毕后页面一团乱，然后会有明显的视觉跳动，继而才会恢复正常。
根据你使用的css预编译语言，将hotcss.less/hotcss.scss import到你的less/scss文件中去，然后定义你的设计图宽度designWidth。
/* /src/scss/style.scss */
@import '../../bower_components/hotcss/dest/hotcss.scss';
$designWidth : 750;/* /src/less/style.less */
@import '../../bower_components/hotcss/dest/hotcss.less';
@designWidth : 750;注意事项:
- 如果你的设计图都是同样的宽度，你可以去
hotcss.**ss中直接定义全局designWidth。 - 每个css预编译文件都需要导入
hotcss.**ss,如果你没有全局的designWidth，还需要定义designWidth。 - 在css预编译文件中使用
px2rem(375)，尺寸是你在设计图上测量出来的px值，无需经过任何处理。直接交给px2rem即可。 - 新版的hotcss已经不建议使用mixins了，因为编译工具里面有
autoprefixer。如果你仍然需要mixins，以后的版本会更新上。
作为一个解决方案，怎么可能让你自己费心再找编译方法呢，没错，这些都已经为你准备好了，你需要做的就是按步骤配置一下即可。
建议开发目录，所有的开发都在src目录下进行，dev目录为开发目录，watch的时候访问此目录，release目录为发布目录
├── bower_components
│ └── hotcss
├── dev
├── release
├── src
│ ├── css
│ ├── img
│ ├── index.html
│ └── js
└── tools
进入项目根目录，使用cp命令将tools文件夹复制到根目录，注意命令最后空格后有一个点。
cp -R bower_components/hotcss/src/tools .
cp -R node_modules/hotcss/src/tools .进入tools目录，执行npm install安装必需的package。
cd tools/
npm install配置tools/config.js怎么配置在注释里面都已经写的很清楚了，如仍然遇到问题，可以与我取得联系。
在tools目录下执行gulp watch
如果当前环境有浏览器，会自动打开http://127.0.0.1:13097/dev/
1.0.4版本中已经修改为自动打开http://你的IP:13097/dev/，方便同域下直接使用手机调试开发。
享受开发的乐趣吧
gulp css：仅编译css预编译文件。gulp watch-css：仅watch css预编译文件，不会自动刷新。gulp watch：watch所配置文件，自动起http服务，同时自带编译，liveload等功能。gulp release：发布命令，根据配置文件编译/压缩并生成，不处理html文件。gulp release -html：带上html命令，会把html一并压缩。