10个值得关注的优秀CSS框架

大多数做过网页设计的都知道“CSS框架”,而且肯定有很多设计师已经开始在作品中使用CSS框架。

  就像其他编程语言一样,CSS也可以把一些重复使用的代码整合起来,这样可以减轻很多的工作量。

  恰当地利用CSS框架可以缩短开发时间,不过话说回来,如果选错了CSS框架胡乱用于实际开发中,必然会适得其反。

 下面介绍的是一些值得深入研究的开源CSS框架,你可以通过搜索轻易地获取源代码。

 

  1.Blueprint:

blueprint

Bluepring  包含了方便实现浏览器兼容的reset css。另外,它还包含了在网页开发中经常用到的很多外部工具和模板。

 

2.960 Grid System

960-system

又一个值得深入研究的CSS框架,提供的源文件包含了Firework、Photoshop、Inkscape等等的模板,可以拿来随手即用,PSD文件中已经预置了参考线,可以为设计师节省不少时间。

 

3.Tripoli Framework

Tripoli可以支持几乎现有的所有浏览器,甚至是IE5,包含了一些基础css库,和一些封装过的CSS插件,比如:Layout、Visual、Type、Negative。

 

4.YAML - Yet Another Multicolumn Layout

YAML是一款开发文档齐全、非常可靠的框架,参照它给出的PDF文档和官方网站上的示例可以很轻松地上手,它也提供很多开发中可以利用的工具,比如李咏YAML Builder可以构造一个机遇YAML的CSS布局实例。

 

5.YUI Grid CSS

YUI Grid CSS不仅支持固定宽度的布局实现还支持不定宽度的布局,这也是它比其他框架更为灵活的地方,你可以下载YUI的cheat sheet和官方网站的YUI Grids Builder来快速上手使用YUI Grids CSS。

 

6.BlueTrip

bluetrip

Blue Trip区别与其他框架的特点是它非常有特色而且十分美观,它的官方网站上有完整的开发文档和demo。

 

7.Content With Style

content-with-style

Conten With Style是一款固定宽度布局的CSS框架,包含了一系列的布局示例比如,一列垂直导航、两列垂直导航等等。

 

8.Elastic CSS Framework

elastic

Elastic提供了用声明式语言来定义布局结构和行为,这个框架还刚刚起步,最好的Demo就是它的官网本身。

 

9.Molio CSS/HTML Templates

Mollio的开发始于IE7暴露出很多渲染的问题,它可以作为网站布局的参考,特别适合CSS初学者。

 

10.SenCSS

sencss

Sen并没有提供布局方面实例,但是有一些类似baseline, fonts, paddings, margins的css可利用,它包含了一个开发版本和一个发布版本。

 

其他的一些CSS框架,可能你也会喜欢:

WYMstyleCSS-boilerplateTypogridphyCleverCSSLogicss

 

选择一框合适的CSS框架不管对学习CSS还是实际开发都是非常有用的,熟悉更多的框架就可以通晓这些框架设计和实现的可鉴之处,提高CSS框架设计水平之日可待。
本站文章如无特殊说明均为原创,转载的朋友请保留文章链接和出处:
本文链接:http://jsssc.cn/10-promising-css-framework-that-worth-a-look/
出处:路可

转载于:https://www.cnblogs.com/joe235/archive/2009/05/31/1492665.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/411413.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

linux服务器 版本 比例,Linux比例近半 服务器操作系统混战开始

一项为期半年的虚拟化调查表明,企业普遍存在多种服务器操作系统混用的情况;受IT投资环境的影响,IT经理们现在更加重视服务器资源利用率。据了解,根据不同应用的特点,大多数企业都在数据中心中同时使用了多种操作系统&a…

[html] 如何在页面打开PDF文件?

[html] 如何在页面打开PDF文件? 移动端如果是安卓的不太能实现直接打开PDF文件,需要使用pdfjs将pdf转换成canvas,再在页面上展示个人简介 我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易, 但坚持一定很酷。欢迎…

ora01031权限不足linux,ORA-01031:权限不足

问题描述:ORA-01031:权限不足我用scott用户创建了一个存储过程,创建成功后我调用改存储过程,就提示我权限不足,是怎么回事锕 ,有谁帮解决一下下锕我的存储过程如下:create or replace procedure xu_create isv_a varchar2(20):&输入表名称;v_b varchar2(20):&am…

解决firebug报“illegal character错误的问题

项目中的一个js文件在firefox中总报“illegal character"错误,而且firebug中显示js文件的首字符有乱码。 用notepad2打开js文件查看编码,当前是UTF-8(含bom),更改为UTF-8 后运行正常。转载于:https://www.cnblogs…

[html] 如何阻止屏幕旋转时自动调整字体的大小?

[html] 如何阻止屏幕旋转时自动调整字体的大小? html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 { -webkit-text-size-adjust:100%; }个人简介 我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易, 但坚持一定很酷。欢迎大家…

arp保持时间 linux,Linux实现ARP缓存老化时间原理问题深入解析

一.问题众所周知,ARP是一个链路层的地址解析协议,它以IP地址为键值,查询保有该IP地址主机的MAC地址。协议的详情就不详述了,你可以看RFC,也可以看教科书。这里写这么一篇文章,主要是为了做一点记录&#xf…

[html] html5中的meta标签http-equiv属性有什么作用?

[html] html5中的meta标签http-equiv属性有什么作用&#xff1f; http-equiv是http5新增的属性&#xff0c;用于把 content 属性关联到 HTTP 头部&#xff0c;可模拟响应头。例如&#xff1a;content-type: 声明网页字符编码<meta http-equiv"content-Type" cont…

[html] 在HTML5中,用于获得用户的当前位置是哪个方法?

[html] 在HTML5中&#xff0c;用于获得用户的当前位置是哪个方法&#xff1f; getCurrentPosition&#xff08;&#xff09;个人简介 我是歌谣&#xff0c;欢迎和大家一起交流前后端知识。放弃很容易&#xff0c; 但坚持一定很酷。欢迎大家一起讨论 主目录 与歌谣一起通关前…

checkboxlist与数组结合用的技

今天看到一个checkboxlist与数组结合用的技巧。用户自定义控件.ascx页面有一个SqlDataSource数据源&#xff0c;还有一个Checkboxlist控件。下面来看看.cs里的关键代码了&#xff1a;public string SelectedValue { get { string s "";…

转Akka是什么?

可扩展的实时事务处理 我们相信编写出正确的、具有容错性和可扩展性的并发程序太困难了。这多数是因为使用了错误的工具和错误的抽象级别。Akka就是为了改变这种状况而生的。通过使用Actor模型我们提升了抽象级别&#xff0c;为构建可扩展的、有弹性的响应式并发应用提供了一个…

[html] 说说你对HTML5中“一次编写,全体使用”的理解

[html] 说说你对HTML5中“一次编写&#xff0c;全体使用”的理解 这个有点组件化的意思&#xff1f;个人简介 我是歌谣&#xff0c;欢迎和大家一起交流前后端知识。放弃很容易&#xff0c; 但坚持一定很酷。欢迎大家一起讨论 主目录 与歌谣一起通关前端面试题

linux 添加path环境变量中,在Linux里设置环境变量PATH的方法是什?

我的mips-linux-gcc编译器在“/opt/au1200_rm/build_tools/bin”目录下&#xff0c;build_tools就是我的编译工具&#xff0c;则有如下三种方法来设置环境变量&#xff1a;1、直接用export命令&#xff1a;#export PATH$PATH:/opt/au1200_rm/build_tools/bin查看是否已经设好&a…

C#开发WPF/Silverlight动画及游戏系列教程(Game Tutorial):(十一)地图遮罩层的实现

前面的章节主要针对地图表现层进行讲解。通常来说&#xff0c;简单的游戏光有它就足够了&#xff1b;但是为了达到更加真实的光影效果&#xff0c;模拟真实的虚拟世界&#xff0c;我们还得继续在地图上下大工夫。本节将就如何实现地图中的遮罩层&#xff0c;即物体对角色的遮挡…

gitlab自带的Nginx与原Nginx冲突的解决方案

gitlab 推荐方案2 默认情况下&#xff0c;gitlab使用自带的Nginx&#xff0c;占用80端口&#xff0c;这样就与系统原本安装的Nginx冲突。导致其中一个nginx无法启动 我的gitlab可以正常启动&#xff0c;当再部署一个接口文档的项目时&#xff0c;发现原nginx无法启动&#xff0…

[html] 本地存储和cookie之间的区别是什么?

[html] 本地存储和cookie之间的区别是什么&#xff1f; 1.储存数据的大小不一样 2.cookie会被每次携带在请求中&#xff0c;而storage不会&#xff0c;只会存储在客户端。个人简介 我是歌谣&#xff0c;欢迎和大家一起交流前后端知识。放弃很容易&#xff0c; 但坚持一定很酷…

linux vue node占用内存过大,vue 大型应用内存泄漏改造经验

VUE项目内存泄漏&#xff1a;场景1&#xff1a;页面结构复杂&#xff0c;内嵌子组件数量较多场景2&#xff1a;高频使用(切换路由导致页面组件销毁创建过多)结果&#xff1a;页面卡顿且浏览器窗口占用内存较高检测&#xff1a;相信不少前端开发在界面结构复杂的VUE大项目或者高…

【python+selenium自动化】使用pytest+allure2完成自动化测试报告的输出

pytest的pytest-html插件是一个很方便的测试报告&#xff0c;运行自动化测试用例时&#xff0c;pytest后加上参数即可 allure是一个测试报告的框架&#xff0c;相比pytest-html的优势就是“逼格” 他的优点除了好看&#xff0c;还有几点&#xff1a; 1、可以把测试的步骤都加到…

windows2008配置来

windows2008配置来 <启用主题> 进入服务面板启用therms服务 <取消必须输入密码登录系统的方法>“运行”中输入&#xff1a;“gpedit.msc“&#xff0c;“计算机配置”→“WINDOWS设置”→“安全设置”→“帐户策略”→“密码策略”。在这个路径下找到“密码必须符合…

[html] 使用svg画出一个矩形

[html] 使用svg画出一个矩形 <svg width"400" height"200" viewbox"0 0 2000 1000"><rect x"200" y"100" width"400" height"200" style"fill: blue"></rect> </svg&g…

linux内核启动失败,裁剪后montavistalinux内核 nfs启动失败

该楼层疑似违规已被系统折叠 隐藏此楼查看此楼DaVinci I2C WARNING: i2c: NACK detectedDaVinci I2C WARNING: i2c: RAR detectedDaVinci I2C WARNING: i2c: NACK detectedDaVinci I2C WARNING: i2c: RAR detectedDaVinci I2C WARNING: i2c: NACK detectedDaVinci I2C WARNING:…