过期域名预定抢注

 找回密碼
 免费注册

精選15個國外CSS框架

[複製鏈接]
發表於 2008-12-10 20:08:33 | 顯示全部樓層 |閱讀模式
框架就是一個你可以用於你的網站項目的基本的概念上的結構體。 css框架通常只是一些css文件的集合,這些文件包括基本佈局、表單樣式、網格或簡單結構、以及樣式重置。比如: # d, b0 r: p- V: K
$ x0 O% ^) K- T4 }" A- \
typography.css 基本排版規則
5 M; L& a% v9 Y( T/ Mgrid.css 基於網格的佈局4 C9 V7 Q( s+ M
layout.css 通常的佈局
# D" U! b4 j. O* W: M2 zform.css for 表單樣式
: q# F) _: o* S6 w! n6 W  ngeneral.css 更多通用規則! u8 Y8 R& b( I8 x
您還可以參考以下前端開發/CSS相關資源:
7 }# K& D  ^7 ?* O) B2 w3 @. h' A
7 S) X, n6 [1 W& m8 H& Z《推薦12款可用於前端開發的免費文本編輯器》1 i' [) ~  ]& p0 v' _9 x
《Web前端開發必備手冊下載》 $ C& U$ V+ k7 |
《推薦20個讓你學習並精通CSS的網站》1 h8 G$ V& G7 y) ]) \. g! e' j1 P
《300+Jquery, CSS, MooTools 和 JS的導航菜單資源》
8 {: m5 W( _7 F% ]. x( D; O7 p下面一起來瞭解一下各種不同的CSS框架吧:0 x- H& C; I0 @9 S
1.960 Grid System
/ Q/ u8 o4 F: a( |6 r7 y% {) B% J. m
  a% ]1 D0 C' q% g960網格系統是一個通過提供通常使用的尺寸簡化網站開發流程的努力的結果,基於960像素的頁面寬度。它有兩種類型,12和16列,他們可以獨立使用或是協同使用。
8 A9 o; ]8 m! E/ c9 H9 T" P
* K8 ]6 V- K5 K6 N2.WYMstyle CSS Framework
  W2 i: F0 S5 z) v$ R3 X! F: {+ n& ~" }& x. O
這個項目的目的是提供一組經過良好測試的模塊化的CSS文件,能夠用於網站的快速設計。WYMstyle是一組CSS文件,你可以很容易的組合這些文件來快速的創建你的網站的佈局。通過提供可靠的、經過良好測試的CSS模塊,WYMstyle 力求讓每個網站防止枯燥的跨瀏覽器兼容性測試。
6 L% Y3 p& A# w+ ]) U3.YAML CSS Framework
6 W, G* |% W1 ]1 b& `$ U% ~1 F- _7 O/ q: T) x6 P* c; R$ l
Dirk Jesse的強大的(X)HTML/CSS框架為許多的簡單或更複雜的網站項目提供完整的默認模板包。YAML基於網頁標準並支持所有現代瀏覽器。所有的 Internet Explorer的主要渲染漏洞都被解決。YAML 完全支持從5.x到7.0的所有的IE版本。
% H6 x; ~, l* [6 b8 {4.YUI Grids CSS+ O& U8 J- F. c, J
& Y: i+ ?1 @' j0 U* R- r
基本的YUI網格CSS提供4種預設的頁寬、6種預設模板和再分為2、3、4卷的區塊的功能。 這個4KB的文件可提供超過1000中頁面佈局組合。
% z- J5 D  H# r  V5 V* V. l7 D: ^6 }6 C8 x& t
有國外作者曾指出YUI Grids CSS中最值得學習的網格佈局CSS寫法:/ z0 @1 q- i  c
負Margin技術8 n$ x# J! i* Q$ p' x
使用度量單位em
  s& s6 s8 c5 G( o! f6 m1 |清除佈局的浮動" X+ B, c  L, c( z
5.Logicss Framework0 D7 k# F7 V" x6 Z, i
: ?& z, G# V7 a( R# }/ R# ~
Logic CSS 框架是用來減少開發符合web標準的xHTML佈局的時間的一個由CSS文件和PHP程序組成的集合。通常跨瀏覽器表現行為(不是Meyer的reset文件或是用「*」),排版支持文本字體大小調整(使用EMs) 和垂直居中,符合可定義的靈活的佈局網格利用css代碼生成玩具。
% O8 h: T+ X0 [7 O6 h4 Y3 P# b
! M2 z- F" E5 P. j: e2 L4 |6.CleverCSS0 D/ s) M% d# f: o* m
1 q+ o$ m9 g2 U
CleverCSS是一個用於css的受Python啟發的小型的標記語言,它可用於以整潔的和結構化的方式創建一個樣式表。在很多方面它都比CSS2整潔和強大。與CSS最明顯的區別是句法:它基於縮進而且不單調。雖然這顯然違反了Python的規則,它依然是組織樣式的很好的主意。
) M" h- {( ^; B5 ?' ]( H4 l
& T+ I8 d0 J  ?7.Elements CSS Frameworks" i, v% P6 b  O! Y

1 t$ y- G' Y. h! _5 F  V4 QElements 是一個實用的CSS框架。它是為了幫助設計師更快更高效的來寫CSS而建立。Elements 已經超越了僅僅作為一個框架,它有自己的項目工作流。它擁有你完成項目所需的所有東西,這也讓你和你的瀏覽者感到愉悅
5 l. O1 e) W* x% s3 H6 g8.Blueprint CSS
1 M" R( z4 @8 g
" y# i; P5 e  b$ xBlueprint 是一個 CSS 框架,它的目的是減少你的css開發時間。它提供一個可靠的css基礎去創建你的項目,BP由一個易用的網格、合理的佈局和一個打印樣式。
' b  p5 `' p( |' G7 m3 y' h; b" R9 Z$ A1 x% n. ^/ `
9.Schema Web Design Framework
/ W( X1 N7 z: S- \* n9 T& y
/ Z. |3 I  t' ASchema 是一個為了提供在重複的設計任務中必須的CSS和HTML標籤而設計的表現層的網頁框架設計。 與為每一個新的網站項目從零開始創建HTMl/CSS不同,Schema提供必要的基礎來開始並立馬讓你的設計跑起來。- {2 F7 e! w0 _- Y" k1 ?' Y

1 [$ ?. U$ r3 ^# S0 [/ E10.Emastic CSS Framework
3 ~$ T9 e1 g' b( a7 ?1 F4 [5 u" Y* k' B2 n/ `% z8 w) S2 v2 C
Emastic 是一個CSS框架,它有連續的任務:探索陌生的新世界,尋找新生活和新的網站空間,大膽的去CSS框架尚未到達的領域。它是輕量的、在頁面寬度上比較人性化,在網格中使用固定和不固定的列寬。 Elastic 用「em」佈局。! Q. G, c1 W$ p  K

. W# Z$ D4 _! Z: P7 U6 M- E& E11.That Standards Guy CSS Framework  B: ?0 _+ g3 o- C( s& C" T  D( @
! }1 O% R4 Z! }" q1 L2 [$ q
* 只能調用單個樣式文件
. i8 @3 P  U: P. Z6 I0 i* 主樣式需要取得CSS認證(WCAG 1.0);
, Z2 e, `1 c  T+ B: }) ~) h* 跨瀏覽器兼容性—包括Internet Explorer (IE) 5.x for Mac;
0 s* o8 v8 G5 N! e4 q) @( |* IE Hacks使用獨立文件;
6 y1 v$ ^0 e: J3 @* 快速創建模板;
( Y5 A! }: L$ C# N5 w2 A* 少量註釋/實例演示,可以節省時間來理解。$ f# @3 B5 f2 {* {

! q/ I1 @' F9 I& {  n12.Content with Style Framework
3 @( \% o5 q0 I7 S# ~7 m: `
# n! H2 d" V6 o8 a# g4 \下一個邏輯步驟就是將這個擴展為CSS框架,允許使用寫好並通過測試的組件來快速開發網站。實際上所需的是搞定一套命名習慣和一個靈活的基本模板…1 M+ @/ m" |6 m5 B& b+ |# l6 M
* A5 I9 F2 Y  b' y4 b# a9 f5 e7 B
13.Boilerplate CSS Framework
3 i/ K$ j9 Z, _$ p7 U7 M  b0 ~7 l1 Z& o3 f
14.ESWAT Web Project Framework2 h% S% K9 L/ s( |
ESWAT正在重新整理。如果你是衝著我的網站框架來的,那麼你就可以在這裡下載。也許你也想看看我的其他項目gmachina、AppleSeed。
0 d* J6 Z* [& h. F( Y  ~% i15.Tripoli CSS Framework
; ~; u& U  n3 o: Q( C  s$ K9 C; x4 d4 s" Q3 g  ?0 m& B& [; }
Tripoli是一個用於HTML表現的通用css規範。通過重設和重建瀏覽器標準,Tripoli 為你的網站項目提供了一個標準的、跨瀏覽器表現的基礎。1 G& A" n3 Z) u9 L; ^
英文原文:CSS Frameworks ; M! e2 v. `& d- h$ N7 B2 ^, v: k
翻譯原文:css框架收集

評分

參與人數 1 +50 收起 理由
回忆月光 + 50

查看全部評分

發表於 2008-12-10 20:19:23 | 顯示全部樓層
我比較看重這個,我最近也自創了一個CSS框架,因為我認為一個好的CSS框架可以輕鬆製作任意精美的模板
9 q  O0 u. F* w不懂的人不知道,懂的人知道這個非常重要
回復 给力 爆菊

使用道具 舉報

 樓主| 發表於 2008-12-10 21:10:12 | 顯示全部樓層
Original posted by 回憶月光 at 2008-12-10 20:19 0 N4 `" l  m, j$ ~, m) o! F
我比較看重這個,我最近也自創了一個CSS框架,因為我認為一個好的CSS框架可以輕鬆製作任意精美的模板
  A5 V- @, x& l0 f5 |5 ^; ?' q不懂的人不知道,懂的人知道這個非常重要
3 Q/ X# v( b; u/ b. U
我不懂,尚在學習中,但我知道這個在seo中是很重要的,
回復 给力 爆菊

使用道具 舉報

發表於 2008-12-22 22:41:32 | 顯示全部樓層
內容太多,慢慢看
回復 给力 爆菊

使用道具 舉報

發表於 2008-12-25 02:02:55 | 顯示全部樓層
頂頂頂頂頂頂頂頂
回復 给力 爆菊

使用道具 舉報

發表於 2009-1-6 18:54:06 | 顯示全部樓層
回復 给力 爆菊

使用道具 舉報

發表於 2009-12-5 20:50:32 | 顯示全部樓層
css學習不錯,謝謝分享
回復 给力 爆菊

使用道具 舉報

發表於 2009-12-5 22:03:36 | 顯示全部樓層
圖片怎麼都看不到了
回復 给力 爆菊

使用道具 舉報

發表於 2009-12-6 12:40:57 | 顯示全部樓層
這個資源不錯,謝謝收藏了。
回復 给力 爆菊

使用道具 舉報

發表於 2009-12-9 15:53:44 | 顯示全部樓層
非常好,謝謝樓主
回復 给力 爆菊

使用道具 舉報

您需要登錄後才可以回帖 登錄 | 免费注册

本版積分規則

过期高净值品牌域名预定抢注

點基跨境 數位編輯創業論壇

GMT+8, 2025-5-18 23:48

By DZ X3.5

小黑屋

快速回復 返回頂部 返回列表