Loading...

此页面上的内容需要较新版本的 Adobe Flash Player。

获取 Adobe Flash Player

  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
 

CSS框架

设置字体:    

CSS框架处:

1、开发效率的提高。
如果你是一个企业建站的前端开发,相信在大部分时间里进行着同类站点的代码工作。定义好的框架可以大大提高你的工作效率,避免一些常见的错误。如果你的工作是按件计费的,你的报酬一定会比别人多。

2、规范代码命名。
在多个站点中你可能会用到一些同样的CLASS或ID。如果你有一套完善的css框架,很快你就能对你的每一个站点的代码进行通读。不用浪费时间在代码的阅读上。

3、更好的团队合作
有些公司会将一些稍大的站点的前端代码分成若干子项目。有过此类经验的朋友应该对这种开发方式深感郁闷,要注意公用css,还有注意相互之间的代码配合。久而久之,废弃代码越来越多,互相之间也难以阅读。如果建立好合适的CSS框架,大家可以减少很多不必要的错误,提升产品质量和工作效率。

4、解决浏览器的兼容性问题
现在大部分项目都要求兼容IE6,7和FF。每个站点可能都会花上一部分时间去处理兼容问题。在框架层面上就将这个问题处理好。就可以为后面的兼容问题节省下大部分时间。

5、一套完整的、结构清晰的结构代码。
CSS框架为你的项目提供一个干净、严谨的基础架构。通过它你可以快速的为你的站点搭建基础的html代码框架。万事开头难,前面的基础工作做好了。后面的开发速度会提高很多。

CSS框架处:

1、你需要完全的理解整套框架
每一个加入项目的人,都需要花一定的时间去完全的理解整套框架及编码规范;

2、你会延续一些框架中的错误bug
没人可以保证自己制定的框架是完美而没有bug的。你可能会需要时间去清理框架中的bug;

3、限制开发思路
框架给出大家基本的架构及开发的思路,这可能会限制你对产品开发的新思路;

4、臃肿的源代码
框架中可能有很大一部分代码不会经常用到,而且还会降低执行效率;

5、框架的语义化
我们已经注意到了HTML代码的语义化。但基于框架的每个站点都是独立唯一的,我们很难去保证CSS框架的语义化。

以上转载地址:http://5key.net/blog/2007/css-layout-elements/

—————————————————————————————————-
如下是基于XHTML模块化布局的文章增加CSS默认重设,为将来的CSS框架打好良好的基础(其实目前已经很好了,只要你掌握了)。

  1. /*
  2. 名称:CSS默认重设
  3. 网名:hemin007
  4. 日期:09/12/14
  5. 网站:http://www.hemin.cn/blog
  6. */
  7. body{ background:#FFFFFF; font-size:12px; font-family:‘宋体’, Arial, Helvetica, sans-serif;}
  8. body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,table,th,td,
  9. img{margin:0;padding:0;}
  10. .partA,.partB,.partC,.partD,.partE,.partF,.partG,.partH,.partI,.partJ,.partK,.partL,.partM,.partN,.partO,.partP,
  11. .partQ,.partR,.partS,.partT,.partU,.partV,.partW,.partX,.partY,.partZ{ overflow:hidden;zoom:1;}
  12. a{ text-decoration:none;}
  13. a:link{ color:#333;}
  14. a:visited{ color:#333;}
  15. a:hover{ color:#F00; text-decoration:underline;}
  16. a:active{ color:#333;}
  17. ul,ol,li{ list-style:none;}
  18. img{ border:0px;}
  19. textarea,input,select{ font-size:12px;}
  20. table {border-collapse: separate;border-spacing: 0;}
  21. h1 {font-size:16px;}
  22. h2 {font-size:16px;font-weight:normal;}
  23. h3 {font-size:14px;}
  24. h4 {font-size:14px;font-weight:normal;}
  25. h5 {font-size:12px;}
  26. h6 {font-size:12px;font-weight:normal;}
  27. .fl{ float:left; display:inline;}
  28. .fr{ float:right; display:inline;}
  29. .clear{ clear:both;}
  30. .part_l,.part_c,.part_r{ float:left;}
作者:He Min
出处:http://www.hemin.cn
本文版权所有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。


5 Comments

  1. Max 说:

    font-family:‘宋体’, Arial, Helvetica, sans-serif;}
    这样的定义,英文会显示什么字体?

    [回复]

    hemin 回复:

    @Max, 不存在英文和汉字显示什么字体吧?统一系统没有宋体,就显示Arial呀?

    [回复]

    smartman 回复:

    @Max,

    当对方的IE系统中不存在 “宋体” 时 优先使用 arial,当 arial不存在时,优先使用 Helvetica,依次类推!

    [回复]

  2. superjunwen 说:

    face8

    [回复]

Leave a comment

Your comment

1; 2; 3; 4; 5; 6; 7; 8; 9; 10; 11; 12; 13; 14; 15; 16; 17; 18; 19; 20; 21; 22;

增大 | 减小输入框高度: + |


↑TOP↓BOTTOM