如何组织css,写出高质量的css代码

!如何组织css
一:css的API
  属于基础部分,这部分的能力用“对”和“错”来评判。
  比如说把文字设置为红色,只能用color:red;这种写法是对的,其他任何写法都是错的。

二:css框架
  不能用“对”和“错”来评判,我们会用“好”、“比较好”、“很烂”、“非常棒”这样的字眼来评判。
  按功能划分:控制字体的css集中在font.css文件里。
  控制颜色的css集中在coloor.css文件里。
  控制布局的css集中在layout.css文件里。
  按区块划分:将头部的css放在head.css中。
  将底部放在foot.css中。
  将侧边栏放在sidebar.css中。
  将主体放在main.css中。

!!不同角度的组织方法都有自己的道理,也有自己的缺点和优点。

笔者最喜欢的一种组织css的方法:base.css+common.css+page.css。
base(具有高度可移植性)
  (base是三者的最底层,提供CSS reset功能和粒度最小的通用类——元子类。这一层会被所有页面引用,
是页面样式所需依赖的最底层。无论何种风格的设计都可以引用它,所以base层要力求精简和通用。
¥¥房子的地基。¥¥)
即按照智能分成:base、common、page。注意的是,这三者不是并列结构,而是层叠结构。
common(可移植性一般)
  (bommon位于三者的中间,我们可以将页面内的元素拆分成一小块一小块功能和样式相对独立的小“模块”,
这些“模块”有些是会大量重复的,我们可以将大量重复的“模块”视为一个组件。从页面里尽可能
多的将组件提取出来,放在common层。网站中高度重用的模块视为组件,放在common层。
¥¥房子的门窗。¥¥
一个网站只有一个common层。common层是放在一个common.css文件里,还是按照功能划分放在
诸如common_form.css、common_imagelist.css的多个文件里,需要根据网站规模来
决定。)

page(几乎无移植性)
  (page位于三者最高层,提供页面级的样式。¥¥房间内的装饰画。¥¥有page层的代码放在一个page.css文件里
,根据页面配上注释,分块书写,便于维护。如:
/*首页*/
.test1{}
.test2{}
/*关于我们*/
.test3{}
.test4{}
/*联系我们*/
.test5{}
.test6{}
!!page.css还是应当越精简越好,能用base层和common层的css解决的,就尽量不要用到page层。)

时间: 2024-12-13 06:20:40

如何组织css,写出高质量的css代码的相关文章

如何写出高质量的JavaScript代码

优秀的Stoyan Stefanov在他的新书中(<Javascript Patterns>)介绍了很多编写高质量代码的技巧,比如避免使用全局变量,使用单一的var关键字,循环式预存长度等等. 这篇文章不仅仅从代码本身来考虑如何优化编码,也从代码的设计阶段来考虑,包括书写API文档,同事的review,使用JSLint.这些习惯都能帮助你编写更加高质量的.更易于理解的.可维护的代码(让你的代码在多年之后仍使你引以为傲). 编写可维护的代码 软件的BUG修复需要花费大量的精力.尤其当代码已经发布

如何写出高质量的技术博客 这边文章出自http://www.jianshu.com/p/ae9ab21a5730 觉得不错直接拿过来了 好东西要大家分享嘛

    如何写出高质量的技术博客?答案是:如果你想,就一定能写出高质量的技术博客.看起来很唯心,但这就是事实.有足够愿力去做一件目标明确,有良好反馈系统的事情往往很简单.就是不停地训练,慢慢地,你自己就能找出规律和技巧.所以,要写出高质量的技术博客,首先要解决为什么要写的问题. 为什么要写 我一直很喜欢的一个学习方法是 Learning by teaching 一个课题,如果你能给不懂的人解释清楚,说明你对这个课题的理解足够深入.把一个课题展开来写,你可能会发现某些方面你还写不清楚,这往往说明你

4年前的随笔---写出高质量程序的要点

从1990年開始敲代码.到如今已经快20年了.总结出写出高质量程序的几个要点: - 1.開始写之前思路越清晰完整越好. - 2.写的过程中代码一定要规范一致,这种代码便于维护和改动.这个规范一致性包括名称.格式.算法等.- 3.发现一处错误,马上回忆有没有可能其他地方具有相同的错误(假设你遵循第2条.就能非常快找到). - 4.多用ASSERT,在我的代码里面,这条语句至少占领了程序总量的1/10. - 5.每写完一段后至少重复看3遍.非常多BUG是非常难用调试器找出来的. - 通过遵循以上规则

10个编程小技巧,教你写出高质量代码!

你会写代码吗你会写高质量代码吗你知道怎么写高质量代码吗不要一上来就开始写代码想清楚,再动手今天,分享10个写代码的小技巧教你写出高质量代码↓↓↓ 1.重构思维模式 不要一上来就开始写代码,要掌握尽量多的重构方法,重构思维方式,掌握重构并不一定是要对原来代码的重构,而是让自己在操作之前就想好该怎么去进行. 2.搞清需求再动手 看到需求之后,肯定多多少少会有一些问题,或是理解上的错误,或是功能实现上的问题,这时,必须要交流清楚,否则,后续将会有更多问题. 3.文档也要写 可能不少人觉得文档没人看,写

小白程序员怎么由量变到质变写出高质量代码

小白程序员怎么由量变到质变写出高质量代码?很多老程序员从事开发多年,有这样一种感觉,查看一些开源项目,如Spring.Apache Common等源码是一件赏心悦目的事情,究其原因,无外两点: 1.代码质量非常高; 2.命名特别规范: 要写高质量的代码,不是一件容易的事,需要长年累月的锻炼,是一个量变到质变的过程,但要写好命名,只需要有比较好的英语语法基础和一种自我意识即可轻松达到. 1.切忌使用没有任何意义的英语字母进行命名. 2.切忌使用拼音,甚至是拼音首字母组合. 3.要使用英文,而且要使

Mysql写出高质量的sql语句的几点建议

CleverCode在实际的工作也写过一些低效率的sql语句.这些语句会给数据库带来很大的压力,最主要的表现就是sql语句运行慢,后来逐渐的去优化和尝试.总结了一些高质量的sql语句的写法.这里CleverCode总结一下分享给大家. [ CleverCode发表在csdn博客中的原创作品,请勿转载,原创地址:http://blog.csdn.net/clevercode/article/details/46341147] 1 建议一:尽量避免在列上运算 尽量避免在列上运算,这样会导致索引失效.

如何写出高质量的代码 data 组件 函数

今天在将以前文件上传的地方全部 改为新的文件上传的api. 在改动的过程中,发现代码有很多不合理的地方 在改的时候,因此也是非常的痛苦的哈. 比如说在data中我有太多的flag标识.俩控制元素的显示和隐藏了.真的是太多了 这样要不得,虽然代码是可以正常的跑的.但是呢?? 以后不利于他人自己以后的维护.这一点我一定赶紧过来. 1在data中不要写太多的公共数据 如何解决了: 能局部显示的,就局部显示吧. 是不是非要data中的数据取显示了. 2学会写局部组件和公共组件 我写的代码还有一个问题 h

怎样才能写出高质量的伪原创,并且排名在前?

1.等价替换法 ①.文字排序法:如随便拿本站的这篇文章"编辑写伪原创文章的五大技巧"如何做等价替换法?通过近义词以及打乱标题关键词顺序来达到等价替换,你可以改成"编辑五大技巧写伪原创文章","五大技巧帮助编辑写伪原创文章"你看标题巧妙改变了,但意思却没变,这就是等价替换法. ②.数字替换法:比如标题:五大伪原创技巧,你可以进行适当的去除几个自己认为不是伪原创技巧的,或者增加一些伪原创技巧,都可以,至少你可以让搜索引擎至少认为你的标题就别树一帜. 

高质量的工程代码为什么难写 (转)

http://kb.cnblogs.com/page/558087/ 之所以想起写这篇文章,是因为最近看到的一个著名的开源项目在内部使用时的各种问题,不得不说,很多的开源的东西思想是不错的,但离真正工程化都有不小的距离,所以没什么商业公司采用的开源产品如果要引入的话一定要慎重,通常会有N多的坑等着你去填,而比较成功的开源项目的背后多数都会有商业公司在背后不断的改进. 遥想我2000年开始学习写asp代码时,觉得写代码也不难呀,无非就是学学语法规则.库就可以写出来,记得有一次我实习面试的时候是让我