团队协同动态CSS开发[个人觉得比less方便]

今天终于总结出一个很方便的动态化开发方式。

感觉比JSS，Less sass方便一些。

需要用到的工具：

Microsoft Visual Studio 2010
Aptana Studio 3

项目介绍：

1、4个人协同编码，很多时候会多人同时修改同一文件。
2、模块化
3、具体见图片说明，有图有真相。



开始工作：
问题1——如何减少重复代码书写？
解决1——模块化

问题2——如何减少书写copy重复的常见代码？如颜色值，边框等。
解决2——动态程序化

我们重点描述【问题2】的解决方法。



所有公用模块，我们都用html后缀。组装的就用aspx后缀。我们的目的就是利用aspx提供的一些基本的程序化功能。



如图，为什么我们在html文件里就可以定义变量呢？
原因很简单，我们最终调用这些公共模块的是aspx。



有图有真相。



这些是对html的处理。
接下来处理css。稍微复杂一些。



先看图——Aspx后缀的css文件，是不是有些怪异？其实不然，我们目的是为利用aspx的程序化功能来处理css。
在head里就要这样来引用了。
<link rel="Stylesheet" type="text/css" href="css/*****.aspx" />
IE是微软的东西，它是绝对兼容的。
谷歌就严格一些。在这个写着css代码的aspx文件的第一行要写这样一行代码。
<%response.ContentType="text/css"%>
然后看看aspx文件里面是什么样子。



函数、变量都是可以随便用的，什么循环之类更加不在话下！
css能用到的也就这些了！

细心的人可能发现了，代码并不高亮。我也很纠结，想在VS2010里配置一下，但是没有找到。有高手请告知！
为了弥补，我用到了外部编辑器Aptana Studio 3。





配置下高亮





根据下列步骤，达到我满意的效果。

但是我的页面都是aspx后缀的，移交工作肯定会很郁闷。
我们最终需要的是全静态的。
怎么办呢？

很简单，生产html即可，于是写了一个很简单的生产工具。



最终生成的html代码



鼠标轻轻一点，立刻实现！快下班了，先写到这里！