欢迎来到HELLO素材网! 南京网站制作选择顺炫科技
丰富的DIV CSS模版、JS,jQuery特效免费提供下载
当前位置:主页 > 建站教程 > DIVCSS教程 >

CSS模块化及多人分工协作

发表于2019-04-12 12:49| 次阅读| 来源网络整理| 作者session

摘要:本人对css框架,css模块这些感念不断比较模糊,齐全跟风形状。最近在工作中遇到的成绩,让本人不得不注重起这个

本人对css框架,css模块这些感念不断比较模糊,齐全跟风形状。最近在工作中遇到的成绩,让本人不得不注重起这个成绩。习气了一集体搞定所有,策划-设计-出页面,当一个名目需求短工夫多人协作实现时,样式文件的布局,css模块、框架的思维就先的尤其重要。

下面这个成绩最近比较困扰:假设几集体同时 做一个网站前台,怎样样分配能让整站 风格一致,样式文件构造正当没有反复冗余,效率最高?求教了几个同窗,失去的答案总结如下:风格一致方面,一同磋商先出草图,依据草图由一集体做出标准风格页面,然后一同开干,剩下的就是不停的修正。制造方面,整站定下几个不同的css文件,每人担任不同的样式文件。

说起来容易的事件,一旦实施起来就不是那么容易了。设计的事,还是不敢冒险,幸而页面不是很多,一级、二级页面加起来不到20个,一集体可能搞定。说下制造过程。

(一)规范css命名、书写顺序和注释。

 这点重要性就不说了,很难设想,一个样式表中同时出现几种“个性化很强”的命名模式会让人多纠结。命名可能利用中间“-”,"_"符号衔接,如text-box,text-content,text_box,或许大小写“驼峰”式书写,textBox,textContent等。注释很重要,注释可能分为三级,大类注释用于css块的划分,如header ,container , footer,二类注释,大类下面的部分模块注释,三类注释一个抉择符内注释,用于一些特殊效果的注释或许hack注释。书写格式,可能采用横排缩进的模式,显示出层级关系。

(二)依据效果图,定上样式表构造划分

 网上很多引见css文件构造划分的,大致就那几个文件:layout.css/main.css/footer.css/header.css/reset.css等等,大家都说本人的好,落实都实际,才明确,没有最好的,只要最适宜的。最好的样式划分,应该是紧紧依赖于HTML构造自身,不是放任四海皆的。
css文件的散布除了要便于当前的分工协作,还有灰常重要的一点:假设字节小的话,可能尽量紧缩升高并发衔接数,假设字节过大,可能宰割,防止下载速度太慢,影响样式加载。这些就是详细成绩详细看待了。比如搜查引擎和门户首页这种访问量极大的页面最好将css写入页面内部。

初步定下一下css样式构造:
  

Example Source Code


     reset.css /*页面样式充值*/
     header.css /*全站头部样式*/
     footer.css /*全站尾部样式*/
     public.css /*全站公共模块样式*/
     index.css /*首页特有样式*/
     container.css /*二级及以下主体样式*/
     print.css /*打印样式*/
     ie.css /*IE hack*/
  

(三)分工协作  

 戏台已经搭玩了,接着就要末尾唱戏。找出一切公共的文字列表,图文混陈列表。一集体担任写在公共模块里,头部、尾部各一集体,二级页面框架一集体,个性化的局部留到最后写。

 实践操作起来还是会有很多成绩,代码的冗余无奈避免,只能最小化。为了高效有时也不得不做出就义。上面只是本人在工作中的一点心得。也是第一次真正的开掘css模块化思维的优越性:便于修正,便于治理,便于多人协作。等待和高手一同讨论。

原文地址: