欢迎各位兄弟 发布技术文章
这里的技术是共享的
什么是css框架
实际上还是让我们从框架说起吧。
框架就是一个你可以用于你的网站项目的基本的概念上的结构体。
css框架通常只是一些css文件的集合,这些文件包括基本布局、表单样式、网格或简单结构、以及样式重置。比如:
您还可以参考以下前端开发/CSS相关资源:
《推荐12款可用于前端开发的免费文本编辑器》
《Web前端开发必备手册下载》
《推荐20个让你学习并精通CSS的网站》
《300+Jquery, CSS, MooTools 和 JS的导航菜单资源》
下面一起来了解一下各种不同的CSS框架吧:
960网格系统是一个通过提供通常使用的尺寸简化网站开发流程的努力的结果,基于960像素的页面宽度。它有两种类型,12和16列,他们可以独立使用或是协同使用。
这个项目的目的是提供一组经过良好测试的模块化的CSS文件,能够用于网站的快速设计。WYMstyle是一组CSS文件,你可以很容易的组合这些文件来快速的创建你的网站的布局。通过提供可靠的、经过良好测试的CSS模块,WYMstyle 力求让每个网站防止枯燥的跨浏览器兼容性测试。
Dirk Jesse的强大的(X)HTML/CSS框架为许多的简单或更复杂的网站项目提供完整的默认模板包。YAML基于网页标准并支持所有现代浏览器。所有的 Internet Explorer的主要渲染漏洞都被解决。YAML 完全支持从5.x到7.0的所有的IE版本。
基本的YUI网格CSS提供4种预设的页宽、6种预设模板和再分为2、3、4卷的区块的功能。 这个4KB的文件可提供超过1000中页面布局组合。
有国外作者曾指出YUI Grids CSS中最值得学习的网格布局CSS写法:
Logic CSS 框架是用来减少开发符合web标准的xHTML布局的时间的一个由CSS文件和PHP程序组成的集合。通常跨浏览器表现行为(不是Meyer的reset 文件或是用“*”),排版支持文本字体大小调整(使用EMs) 和垂直居中,符合可定义的灵活的布局网格利用css代码生成工具。
CleverCSS是一个用于css的受Python启发的小型的标记语言,它可用于以整洁的和结构化的方式创建一个样式表。在很多方面它都比 CSS2整洁和强大。与CSS最明显的区别是句法:它基于缩进而且不单调。虽然这显然违反了Python的规则,它依然是组织样式的很好的主意。
Elements 是一个实用的CSS框架。它是为了帮助设计师更快更高效的来写CSS而建立。Elements 已经超越了仅仅作为一个框架,它有自己的项目工作流。它拥有你完成项目所需的所有东西,这也让你和你的浏览者感到愉悦。阅读 概述 了解更多。
Blueprint 是一个 CSS 框架,它的目的是减少你的css开发时间。它提供一个可靠的css基础去创建你的项目,BP由一个易用的网格、合理的布局和一个打印样式。
Schema 是一个为了提供在重复的设计任务中必须的CSS和HTML标签而设计的表现层的网页框架设计。 与为每一个新的网站项目从零开始创建HTMl/CSS不同,Schema提供必要的基础来开始并立马让你的设计跑起来。
Emastic 是一个CSS框架,它有连续的任务:探索陌生的新世界,寻找新生活和新的网站空间,大胆的去CSS框架尚未到达的领域。它是轻量的、在页面宽度上比较人性化,在网格中使用固定和不固定的列宽。 Elastic 用“em”布局。
* 只能调用单个样式文件
* 主样式需要取得CSS认证(WCAG 1.0);
* 跨浏览器兼容性—包括Internet Explorer (IE) 5.x for Mac;
* IE Hacks使用独立文件;
* 快速创建模板;
* 少量注释/实例演示,可以节省时间来理解。
下一个逻辑步骤就是将这个扩展为CSS框架,允许使用写好并通过测试的组件来快速开发网站。实际上所需的是搞定一套命名习惯和一个灵活的基本模板…
ESWAT正在重新整理。如果你是冲着我的网站框架来的,那么你就可以在这里下载。也许你也想看看我的其他项目gmachina、AppleSeed。
Tripoli是一个用于HTML表现的通用css规范。通过重设和重建浏览器标准,Tripoli 为你的网站项目提供了一个标准的、跨浏览器表现的基础。
彬Go会经常更新前端开发/网页设计等相关技术及教程文章,欢迎订阅本博客来及时浏览本博客的最新教程及资源。
英文原文:CSS Frameworks
翻译原文:css框架收集
[...] 《精选15个国外CSS框架》 《目前比较全的CSS重设(reset)方法总结》 《推荐20个让
LZ,有没有办法找到介绍这些框架应用的网站演示?
回复i.don:
我能找到很多英文的演示和介绍,比如这个YAML的实例:
http://www.yaml.de/fileadmin/examples/05_layouts_advanced/3col_fixed_seo.html
google一下,到处都是,呵呵
[...] 《精选15个国外CSS框架》 《推荐20个让
很棒的资源,都是你翻译的吗,一定很辛苦吧,谢谢咯!
960 Grid System
这个很不错啊 用着开发速度很快的说,这篇文章我转了 呵呵
用过blueprint,
在用YAML 感觉不错
[...] 精选15个国外CSS框架(已翻译成中文) [...]
很棒
LZ,比如说960 Grid System,我要怎样把它用于自己的网页设计当中了。
[...] 精选15个国外CSS框架(已翻译成中文) [...]
960 Grid System
国内很多门户都把站点的宽度改成了960Px了,就是这个960像素之谜吧?
[...] 材资源&灵感 (已翻译成中文) 10种JavaScript特效实例让
[...] 精选15个国外CSS框架(已翻译成中文) [...]LZ,这个是什么意思?东西呢?
不错·我觉得css框架有利有弊·
[...] 《精选15个国外CSS框架》 《目前比较全的CSS重设(reset)方法总结》 《推荐20个让
[...] 材资源&灵感 (已翻译成中文) 10种JavaScript特效实例让
[...] 材资源&灵感 (已翻译成中文) 10种JavaScript特效实例让
[...] 精选15个国外CSS框架(已翻译成中文) [...]
[...] 《精选15个国外CSS框架》 《10个非常棒的Ajax及Javascript实例资源网站》 [...]
不错,做参考还可以,但要想真正的适合自己还是要diy一下的
还是比较喜欢960的灵活简单方便=w=
站长好,
请问如何去除两个列之间的间隙?用alpha和omega能去除,不过列的位置移动了,我是指如何让两个列完全平分960PX,各自为480PX,中间没有间隙。
如何做这个效果呢?
谢谢了。
[...] 《精选15个国外CSS框架》 《推荐20个让
[...] 精选15个国外CSS框架(已翻译成中文) [...]
没学过框架,郁闷呢,一定要抓紧学习了
[...] See the article here: 精选前端开发15个国外CSS框架 | 彬Go [...]
自己用用可以,合作项目的话用了别人以后不好改.
不错的才华(如果没有水分的话),我正需要建一网站,看看是否真会给出理想的产品,有意联系qq12888020
[...] 《精选15个国外CSS框架》 《目前比较全的CSS重设(reset)方法总结》 [...]
支持楼主了,好东西啊,
来看看!支持一下!
这些果然是精选出来的好东西
说的很好 960 Grid System
资源很丰富,认真地利用好上面的网站资源,对于提高自己是有很大的帮助的!
不错的框架
960那个真不错
对于简单应用、快速开发,CSS框架没的说。如果要是复杂应用,建议还是自己写吧。
好文章!
框架和IDE有什么区别不?
真棒的文章!
[...] 精选15个国外CSS框架 [...]
[...] 对于开发者来说,用框架总好于不用。还有很多优秀的CSS框架可用。960 Grid System是一个比较单纯的框架,它不关心字体、颜色⋯⋯你可以为自己的网站定制一份字体颜色的框架。但框架也意味着难免会有一些你用不上的样式,如果 你的网站很在意这方面的问题,需要谨慎考虑使用框架。 [...]
[...] 精选15个国外CSS框架(已翻译成中文) [...]
这东西有用吗?
这些css框架还没看到过,可以下载吗?
可以给个项目事例吗?
[...] 《精选15个国外CSS框架》 《10个非常棒的Ajax及Javascript实例资源网站》 [...]
太多了,只用960
学习了,之前只知道第一个。。
谢谢楼主资源共享,很不错的东东!
本来打算用blueprint
既然楼上很多人说960不错
我就试试960看看.
虽然是08年的文章,不过这些CSS框架还是不错滴,与时俱进了。
很好的东西
[...] 对于开发者来说,用框架总好于不用。还有很多优秀的CSS框架可用。960 Grid System是一个比较单纯的框架,它不关心字体、颜色⋯⋯你可以为自己的网站定制一份字体颜色的框架。但框架也意味着难免会有一些你用不上的样式,如果 你的网站很在意这方面的问题,需要谨慎考虑使用框架。 [...]
我在做一个内部项目. 想支持IE,以及full width. 希望博主能推荐一个.. full width的浏览器兼容不好做啊..
哎
呵呵呵
我表示看完了以后依然不知所云……没有归纳各自的特色。。
这个得先收藏了再慢慢研究了.
您好,彬go,很喜欢你的博客,看得出你是一个做事十分认真的人,在此有个问题想请教。
我是我们公司的宣传人员,以前从未接触过网页设计。现在经常要做一些宣传用的HTML邮件,我通常的做法是:先用PS设计好版式—然后用firworks切片—导出为HTML网页—复制在Outlook里。这样做导致邮件体积很大,而且布局常常不受控制,十分烦人。
在这里请教,作为初学者,我如何改善工作流程?有什么软件或方法推荐吗?谢谢你。
彬Go这个名字真有型,分享的东西很好。谢谢咯
很纳闷为什么要用CSS框架
收集整理的不错哦
[...] 对于开发者来说,用框架总好于不用。还有很多优秀的CSS框架可用。960 Grid System是一个比较单纯的框架,它不关心字体、颜色⋯⋯你可以为自己的网站定制一份字体颜色的框架。但框架也意味着难免会有一些你用不上的样式,如果 你的网站很在意这方面的问题,需要谨慎考虑使用框架。 [...]
[...] 對於開發者來說,用框架總好於不用。還有很多優秀的CSS框架可用。 960 Grid System是一個比較單純的框架,它不關心字體、顏色⋯⋯你可以為自己的網站定制一份字體顏色的框架。但框架也意味著難免會有一些你用不上的樣式,如果 你的網站很在意這方面的問題,需要謹慎考慮使用框架。 [...]
[...] 《精选15个国外CSS框架》《目前比较全的CSS重设(reset)方法总结》《推荐20个让你学习并精通CSS的网站》《使用CSS完美实现垂直居中 的方法》《整理及优化CSS代码的7个原则》 《10个CSS简写技巧让你永远受用》 《300+Jquery, CSS, MooTools 和 JS的导航菜单资源》 [...]
其实对于960这个还是有点了解的,把样式写成框架,很强大!
这些框架很不错,才会一个
收藏之
[...] 如果您对其他CSS框架也很感兴趣或想了解更多CSS框架,您可以参考《精选15个国外CSS框架》。 [...]
[...] 《精选15个国外CSS框架》 《目前比较全的CSS重设(reset)方法总结》 [...]
[...] 精选15个国外CSS框架 [...]
来自 http://blog.bingo929.com/css-frameworks-15.html