ʲôÊÇcss¿ò¼Ü
ʵ¼ÊÉÏ»¹ÊÇÈÃÎÒÃÇ´Ó¿ò¼Ü˵Æð°É¡£
¿ò¼Ü¾ÍÊÇÒ»¸öÄã¿ÉÒÔÓÃÓÚÄãµÄÍøÕ¾ÏîÄ¿µÄ»ù±¾µÄ¸ÅÄîÉϵĽṹÌå¡£
css¿ò¼Üͨ³£Ö»ÊÇһЩcssÎļþµÄ¼¯ºÏ£¬ÕâЩÎļþ°üÀ¨»ù±¾²¼¾Ö¡¢±íµ¥Ñùʽ¡¢Íø¸ñ»ò¼òµ¥½á¹¹¡¢ÒÔ¼°ÑùʽÖØÖᣱÈÈ磺
- typography.css »ù±¾ÅÅ°æ¹æÔò
- grid.css »ùÓÚÍø¸ñµÄ²¼¾Ö
- layout.css ͨ³£µÄ²¼¾Ö
- form.css for ±íµ¥Ñùʽ
- general.css ¸ü¶àͨÓùæÔò
Äú»¹¿ÉÒԲο¼ÒÔÏÂÇ°¶Ë¿ª·¢/CSSÏà¹Ø×ÊÔ´:
¡¶ÍƼö12¿î¿ÉÓÃÓÚÇ°¶Ë¿ª·¢µÄÃâ·ÑÎı¾±à¼Æ÷¡·
¡¶WebÇ°¶Ë¿ª·¢±Ø±¸ÊÖ²áÏÂÔØ¡·
¡¶ÍƼö20¸öÈÃÄãѧϰ²¢¾«Í¨CSSµÄÍøÕ¾¡·
¡¶300+Jquery, CSS, MooTools ºÍ JSµÄµ¼º½²Ëµ¥×ÊÔ´¡·
ÏÂÃæÒ»ÆðÀ´Á˽âһϸ÷ÖÖ²»Í¬µÄCSS¿ò¼Ü°É:
1.960 Grid System
960Íø¸ñϵͳÊÇÒ»¸öͨ¹ýÌṩͨ³£Ê¹Óõijߴç¼ò»¯ÍøÕ¾¿ª·¢Á÷³ÌµÄŬÁ¦µÄ½á¹û£¬»ùÓÚ960ÏñËصÄÒ³Ãæ¿í¶È¡£ËüÓÐÁ½ÖÖÀàÐÍ£¬12ºÍ16ÁУ¬ËûÃÇ¿ÉÒÔ¶ÀÁ¢Ê¹ÓûòÊÇÐͬʹÓá£
2.WYMstyle CSS Framework
Õâ¸öÏîÄ¿µÄÄ¿µÄÊÇÌṩһ×é¾¹ýÁ¼ºÃ²âÊÔµÄÄ£¿é»¯µÄCSSÎļþ£¬Äܹ»ÓÃÓÚÍøÕ¾µÄ¿ìËÙÉè¼Æ¡£WYMstyleÊÇÒ»×éCSSÎļþ£¬Äã¿ÉÒÔºÜÈÝÒ×µÄ×éºÏÕâЩÎļþÀ´¿ìËٵĴ´½¨ÄãµÄÍøÕ¾µÄ²¼¾Ö¡£Í¨¹ýÌṩ¿É¿¿µÄ¡¢¾¹ýÁ¼ºÃ²âÊÔµÄCSSÄ£¿é£¬WYMstyle Á¦ÇóÈÃÿ¸öÍøÕ¾·ÀÖ¹¿ÝÔïµÄ¿çä¯ÀÀÆ÷¼æÈÝÐÔ²âÊÔ¡£
3.YAML CSS Framework
Dirk JesseµÄÇ¿´óµÄ(X)HTML/CSS¿ò¼ÜΪÐí¶àµÄ¼òµ¥»ò¸ü¸´ÔÓµÄÍøÕ¾ÏîÄ¿ÌṩÍêÕûµÄĬÈÏÄ£°å°ü¡£YAML»ùÓÚÍøÒ³±ê×¼²¢Ö§³ÖËùÓÐÏÖ´úä¯ÀÀÆ÷¡£ËùÓÐµÄ Internet ExplorerµÄÖ÷ÒªäÖȾ©¶´¶¼±»½â¾ö¡£YAML ÍêÈ«Ö§³Ö´Ó5.xµ½7.0µÄËùÓеÄIE°æ±¾¡£
4.YUI Grids CSS
»ù±¾µÄYUIÍø¸ñCSSÌṩ4ÖÖÔ¤ÉèµÄÒ³¿í¡¢6ÖÖÔ¤ÉèÄ£°åºÍÔÙ·ÖΪ2¡¢3¡¢4¾íµÄÇø¿éµÄ¹¦ÄÜ¡£ Õâ¸ö4KBµÄÎļþ¿ÉÌṩ³¬¹ý1000ÖÐÒ³Ãæ²¼¾Ö×éºÏ¡£
ÓйúÍâ×÷ÕßÔøÖ¸³öYUI Grids CSSÖÐ×îÖµµÃѧϰµÄÍø¸ñ²¼¾ÖCSSд·¨:
- ¸ºMargin¼¼Êõ
- ʹÓöÈÁ¿µ¥Î»em
- Çå³ý²¼¾ÖµÄ¸¡¶¯
5.Logicss Framework
Logic CSS ¿ò¼ÜÊÇÓÃÀ´¼õÉÙ¿ª·¢·ûºÏweb±ê×¼µÄxHTML²¼¾ÖµÄʱ¼äµÄÒ»¸öÓÉCSSÎļþºÍPHP³ÌÐò×é³ÉµÄ¼¯ºÏ¡£Í¨³£¿çä¯ÀÀÆ÷±íÏÖÐÐΪ(²»ÊÇMeyerµÄresetÎļþ»òÊÇÓÓ*”)£¬ÅÅ°æÖ§³ÖÎı¾×ÖÌå´óСµ÷Õû(ʹÓÃEMs) ºÍ´¹Ö±¾ÓÖУ¬·ûºÏ¿É¶¨ÒåµÄÁé»îµÄ²¼¾ÖÍø¸ñÀûÓÃcss´úÂëÉú³É¹¤¾ß¡£
6.CleverCSS
CleverCSSÊÇÒ»¸öÓÃÓÚcssµÄÊÜPythonÆô·¢µÄСÐ͵ıê¼ÇÓïÑÔ£¬Ëü¿ÉÓÃÓÚÒÔÕû½àµÄºÍ½á¹¹»¯µÄ·½Ê½´´½¨Ò»¸öÑùʽ±í¡£Ôںܶ෽ÃæËü¶¼±ÈCSS2Õû½àºÍÇ¿´ó¡£ÓëCSS×îÃ÷ÏÔµÄÇø±ðÊǾ䷨£ºËü»ùÓÚËõ½ø¶øÇÒ²»µ¥µ÷¡£ËäÈ»ÕâÏÔȻΥ·´ÁËPythonµÄ¹æÔò£¬ËüÒÀÈ»ÊÇ×éÖ¯ÑùʽµÄºÜºÃµÄÖ÷Òâ¡£
7.Elements CSS Frameworks
Elements ÊÇÒ»¸öʵÓõÄCSS¿ò¼Ü¡£ËüÊÇΪÁË°ïÖúÉè¼Æʦ¸ü¿ì¸ü¸ßЧµÄÀ´Ð´CSS¶ø½¨Á¢¡£Elements ÒѾ³¬Ô½Á˽ö½ö×÷Ϊһ¸ö¿ò¼Ü£¬ËüÓÐ×Ô¼ºµÄÏîÄ¿¹¤×÷Á÷¡£ËüÓµÓÐÄãÍê³ÉÏîÄ¿ËùÐèµÄËùÓж«Î÷£¬ÕâÒ²ÈÃÄãºÍÄãµÄä¯ÀÀÕ߸е½ÓäÔá£ÔĶÁ ¸ÅÊö Á˽â¸ü¶à¡£
8.Blueprint CSS
Blueprint ÊÇÒ»¸ö CSS ¿ò¼Ü£¬ËüµÄÄ¿µÄÊǼõÉÙÄãµÄcss¿ª·¢Ê±¼ä¡£ËüÌṩһ¸ö¿É¿¿µÄcss»ù´¡È¥´´½¨ÄãµÄÏîÄ¿£¬BPÓÉÒ»¸öÒ×ÓõÄÍø¸ñ¡¢ºÏÀíµÄ²¼¾ÖºÍÒ»¸ö´òÓ¡Ñùʽ¡£
9.Schema Web Design Framework
Schema ÊÇÒ»¸öΪÁËÌṩÔÚÖظ´µÄÉè¼ÆÈÎÎñÖбØÐëµÄCSSºÍHTML±êÇ©¶øÉè¼ÆµÄ±íÏÖ²ãµÄÍøÒ³¿ò¼ÜÉè¼Æ¡£ ÓëΪÿһ¸öеÄÍøÕ¾ÏîÄ¿´ÓÁ㿪ʼ´´½¨HTMl/CSS²»Í¬£¬SchemaÌṩ±ØÒªµÄ»ù´¡À´¿ªÊ¼²¢Á¢ÂíÈÃÄãµÄÉè¼ÆÅÜÆðÀ´¡£
10.Emastic CSS Framework
Emastic ÊÇÒ»¸öCSS¿ò¼Ü£¬ËüÓÐÁ¬ÐøµÄÈÎÎñ£ºÌ½Ë÷Ä°ÉúµÄÐÂÊÀ½ç£¬Ñ°ÕÒÐÂÉú»îºÍеÄÍøÕ¾¿Õ¼ä£¬´óµ¨µÄÈ¥CSS¿ò¼ÜÉÐδµ½´ïµÄÁìÓò¡£ËüÊÇÇáÁ¿µÄ¡¢ÔÚÒ³Ãæ¿í¶ÈÉϱȽÏÈËÐÔ»¯£¬ÔÚÍø¸ñÖÐʹÓù̶¨ºÍ²»¹Ì¶¨µÄÁÐ¿í¡£ Elastic ÓÓem”²¼¾Ö¡£
11.That Standards Guy CSS Framework
* Ö»Äܵ÷Óõ¥¸öÑùʽÎļþ
* Ö÷ÑùʽÐèҪȡµÃCSSÈÏÖ¤(WCAG 1.0)£»
* ¿çä¯ÀÀÆ÷¼æÈÝÐÔ—°üÀ¨Internet Explorer (IE) 5.x for Mac£»
* IE HacksʹÓöÀÁ¢Îļþ£»
* ¿ìËÙ´´½¨Ä£°å£»
* ÉÙÁ¿×¢ÊÍ/ʵÀýÑÝʾ£¬¿ÉÒÔ½Úʡʱ¼äÀ´Àí½â¡£
12.Content with Style Framework
ÏÂÒ»¸öÂß¼²½Öè¾ÍÊǽ«Õâ¸öÀ©Õ¹ÎªCSS¿ò¼Ü£¬ÔÊÐíʹÓÃдºÃ²¢Í¨¹ý²âÊÔµÄ×é¼þÀ´¿ìËÙ¿ª·¢ÍøÕ¾¡£Êµ¼ÊÉÏËùÐèµÄÊǸ㶨һÌ×ÃüÃûÏ°¹ßºÍÒ»¸öÁé»îµÄ»ù±¾Ä£°å…
13.Boilerplate CSS Framework
14.ESWAT Web Project Framework
ESWATÕýÔÚÖØÐÂÕûÀí¡£Èç¹ûÄãÊdzå×ÅÎÒµÄÍøÕ¾¿ò¼ÜÀ´µÄ£¬ÄÇôÄã¾Í¿ÉÒÔÔÚÕâÀïÏÂÔØ¡£Ò²ÐíÄãÒ²Ïë¿´¿´ÎÒµÄÆäËûÏîÄ¿gmachina¡¢AppleSeed¡£
15.Tripoli CSS Framework
TripoliÊÇÒ»¸öÓÃÓÚHTML±íÏÖµÄͨÓÃcss¹æ·¶¡£Í¨¹ýÖØÉèºÍÖؽ¨ä¯ÀÀÆ÷±ê×¼£¬Tripoli ΪÄãµÄÍøÕ¾ÏîÄ¿ÌṩÁËÒ»¸ö±ê×¼µÄ¡¢¿çä¯ÀÀÆ÷±íÏֵĻù´¡¡£
±òGo»á¾³£¸üÐÂÇ°¶Ë¿ª·¢/ÍøÒ³Éè¼ÆµÈÏà¹Ø¼¼Êõ¼°½Ì³ÌÎÄÕ£¬»¶Ó¶©Ôı¾²©¿ÍÀ´¼°Ê±ä¯ÀÀ±¾²©¿ÍµÄ×îн̳̼°×ÊÔ´¡£