前端项目应该如何规划css结构便于重构和维护？

Question

项目前期是不支持移动端的适应，只支持PC和pad；
后期会添加对移动端的支持，
那么前期应该【如何规划好项目的CSS样式，便于维护】？
另外：
页面数量少于10个，有必要做一套符合自己项目的【bootstrap】一样的UI样式吗？
或是根据PSD设计图从上到下一个一个写，能复用的就复用？
我现在是这样做的：
写一个公共样式（重置、全局样式、布局、字体样式、表单、按钮，颜色）+某页面特殊样式.css
感觉改起来很乱，因为有些不知道应该放在什么位置上。

Answer 1

CSS编译器应该是你需要的。在Node项目中我喜欢用stylus。在Rails项目中我喜欢用sass。其它项目里我喜欢用less。关于如何组织维护，确实看看bootstrap学习学习甚好，但在实际项目中，可能要根据自己的业务需求稍作调整吧。比如我其中的一个项目，代码如下：@import"compass";@import"compass/reset";@import"config";@import"global";@import"header";@import"footer";//components@import"components/type";@import"components/form";@import"components/btn";@import"components/icon";@import"components/table";//modules@import"modules/agree";@import"modules/bank";@import"modules/dialog";@import"modules/divider";@import"modules/diyselect";@import"modules/hint";@import"modules/jump";@import"modules/protocal";@import"modules/step";@import"modules/subject";@import"modules/tab";@import"modules/text";@import"modules/tipbox";@import"modules/tiptext";@import"modules/typelist";@import"modules/title";@import"modules/video";//pages@import"pages/account";@import"pages/audit";@import"pages/collect";@import"pages/depository";@import"pages/error";@import"pages/faq";@import"pages/mobile";@import"pages/profile";@import"pages/password";项目地址