ãè¿äºå端æ¡æ¶è½ä¸ºæ¨æä¾ä»¥ä¸å¥½å¤ï¼
è·¨æµè§å¨ï¼å端æ¡æ¶é½å¨ä¸åçæµè§å¨æµè¯éè¿ã
ä¸è´æ§ï¼ UI ç»ä»¶ï¼å¦å¯¼èªï¼æé®ï¼æ ç¾ï¼è¡¨åï¼ä¸æèåï¼è¡¨æ ¼... ä»ä»¬çé£æ ¼é½ç¸äºç»ä¸ã
å¿«éå¼åï¼æ¨å¯ä»¥è½»æ¾ï¼å¿«éçæ建ä¸ä¸ªå¸å±ãä»ä»¬é常æ代ç ç段åä¼ç§çææ¡£ã
ååºå¼ï¼ææ CSS ç»ä»¶å Javascript æ件è½å¤ä»æ¡é¢æ©å±å°ç§»å¨ç«¯ã
InK
ããInk æ¯ä¸ä¸ªç¨äºå¿«éå¼å Web çé¢ç UI å¥ä»¶ï¼ç®åæç¨åãå®éè¿æ´å HTMLï¼CSS å JavaScript æ¥æä¾ç°ä»£åç解å³æ¹æ¡ï¼æ建å¸å±ï¼æ¾ç¤ºéç¨ççé¢å
ç´ ï¼ä¸ºä½ çç¨æ·å®ç°å
容为ä¸å¿çåç¨æ·å好çäºå¨åè½ã
HTML & CSS ç»ä»¶ï¼å¸å±ï¼å¯¼èªï¼æçï¼å¾æ ï¼è¡¨æ ¼ï¼æéï¼è¡¨åã
JavaScript ç»ä»¶ï¼ç»å»ï¼æ¨¡æçªå£ï¼è¡¨æ ¼ï¼å¯æåºçæ¥æéæ©å¨ï¼é项å¡ï¼è¡¨åéªè¯ï¼è¡ä¸ºï¼åé ï¼æå ï¼å
³éï¼ã
å
¶å®ç¹æ§ï¼æ¯æ Sass æ··å
¥ã
GroundworkCSS
ããGroundworkCSS çµæ´»çç½æ ¼ç³»ç»ä½¿ä½ è½å¤å¿«éå¼åï¼å¹¶è½å¤éåºä»»ä½å±å¹å°ºå¯¸ï¼ä»ææ设å¤å°å¤§å°ºå¯¸çæ¾ç¤ºå±ãGroundworkCSS æ建å¨å¼ºå¤§ç CSS é¢å¤çå¨ Sass çåºç¡ä¸ãSass æ¯å¯¹ CSS3 çæ©å±ï¼å¹¶æ·»å äºåµå¥è§åï¼åéï¼æ··å
¥ï¼éæ©å¨ç»§æ¿ççä¼å¤ç¹æ§ã使ç¨å½ä»¤è¡å·¥å
·æ Web æ¡æ¶æ件å¯ä»¥è½¬æ¢ä¸ºæ åç CSS 代ç ã
HTML & CSS ç»ä»¶ï¼ç½æ ¼ï¼å¸å±ï¼æçï¼æé®ï¼ç·ç ï¼è¡¨æ ¼ï¼è¡¨æ ¼ï¼å¾ç¤ºï¼ç¤¾ä¼çå¾æ ï¼ååºææ¬ï¼æ¶æ¯ï¼è¦æ¥ã
JavaScript ç»ä»¶ï¼å¯¼èªï¼æ ç¾ï¼å·¥å
·æ示ã
å
¶å®ç¹æ§ï¼æ¯æ Sass æ··å
¥ã
Ivory
ããçµæ´»ï¼å¼ºå¤§çååºå¼ Web æ¡æ¶ï¼ä½¿ Web å¼åæ´å¿«ï¼æ´å®¹æãæ¯æ 1200 åç´ å° 320px åºé´çååºå¼å¸å±ã
HTML & CSS ç»ä»¶ï¼ç½æ ¼ï¼æçï¼è¡¨åï¼æé®ï¼æéï¼å页ï¼é¢å
å±ï¼å表ï¼è¡¨æ ¼ã
JavaScript ç»ä»¶ï¼å·¥å
·æ示ï¼é项å¡ï¼åæ¢å¼å
³ï¼æé£ç´ã
Foundation
ããFoundation æ¯ç±å å©ç¦å°¼äºå·ç产å设计å
¬å¸ Zurb æ¨åºçãè¿æ¯ç®åæå
è¿çååºå¼å端æ¡æ¶ï¼å®æå¾å¤ç模æ¿å¸å±ï¼UI ç»ä»¶ç CSS æ ·å¼ï¼ä¹æ¶å½äºå¾å¤ä»ä»¬èªå·±ç JavaScript æ件ã
HTML & CSS ç»ä»¶ï¼ç½æ ¼å¸å±æ¨¡æ¿ï¼å¾æ ï¼åä½ï¼ååºå¼è¡¨æ ¼ï¼SVG 社交å¾æ ï¼å页ï¼é¢å
å±ï¼è¾¹æ 导èªï¼æé®ï¼åä½ï¼æ ç¾ï¼æéï¼é¢æ¿ï¼ä»·æ ¼è¡¨ï¼è¿åº¦æ¡ï¼è¡¨æ ¼ï¼ç¼©ç¥å¾ã
JavaScript ç»ä»¶ï¼ä¸ææé®ï¼åå²æé®ï¼å¼å
³ï¼èªéåºè§é¢ï¼ç¯ç®±ï¼ä¸æå表ï¼å¯¼èªï¼æ¾ç¤ºæ¨¡æçªå£ï¼é项å¡ï¼å·¥å
·æ示ã
å
¶ä»ç¹æ§ï¼èªå®ä¹ç®è¤ç表åï¼SCSS æ··å
¥ã
Grumby
ããGumby 2 åºäºå¼ºå¤§ç Sass æ建ï¼Sass æ¯ä¸ä¸ªåè½å¼ºå¤§ç CSS é¢å¤çå¨ï¼è¿ä½¿æ们è½å¤å¿«éçå¼åèªå·±ç Gumbyï¼å¹¶ä¸ºæ¨æä¾æ°çå·¥å
·ï¼è®©ä½ è½å¤å¨ Gumby çæ¡æ¶åºç¡ä¸å¿«éå®å¶ã
HTML & CSS ç»ä»¶ï¼ç½æ ¼ï¼è¡¨åï¼æé®ï¼å¯¼èªï¼æ ç¾ï¼Entypo å¾æ ã
JavaScript ç»ä»¶ï¼åæ¢å¼å
³ï¼ä¸ææ¡ï¼é项å¡ï¼æ¨¡æçªå£ã
å
¶ä»ç¹æ§ï¼èªå®ä¹ç®è¤ç表åï¼SASS & Compassã
HTML KickStart
ããè¶
ç²¾çç HTML5ï¼CSS & JS 模åï¼ç¨äºå¿«éç½ç«å¶ä½ãå®æä¸ä¸ªå
¨é¢ç UI ç»ä»¶ï¼ä¹æä¸äºæç¨ç JavaScript æ件ï¼å®çç®æ æ¯æ为设计å¸çæåã
HTML & CSS ç»ä»¶ï¼ç½æ ¼ï¼æçï¼æé®ï¼æé®æ¡ï¼å表ï¼è¡¨æ ¼ï¼å¾æ ï¼é¢å
å±ï¼å¾åï¼è¡¨æ ¼ã
JavaScriptï¼èåï¼å·¥å
·æ示ï¼è¯æ³é«äº®ï¼é项å¡ï¼å¹»ç¯çï¼è¡¨åéªè¯ã
å
¶ä»ç¹æ§ï¼é¢å¤ç CSS å·¥å
·ã
Maxmertkit
ããè¿ä¸ªæ¡æ¶æ¯ç± Vetrenko Maxim Sergeevich å建çï¼ä½¿ç¨åºåççæ´»æ´è½»æ¾ãMaxmerkit æ¯åºäºé¨ä»¶ä¿®æ¹å¨ç¼ç é£æ ¼çä¸ä¸ª CSS æ¡æ¶ã
HTML & CSS ç»ä»¶ï¼ç½æ ¼å¸å±ï¼typograpghyï¼å¾½ç« ï¼æé®ï¼æå
¥ç¬¦ï¼è¡¨æ ¼ï¼å¾æ ï¼æ ç¾ï¼èåï¼è¿åº¦è¡¨ï¼ä¸æèåï¼å·¥å
·æ示ã
JavaScript ç»ä»¶ï¼æé®ï¼è½¬çï¼æ¨¡æçªå£ï¼éç¥ï¼å¼¹åºå±ï¼é项å¡ï¼æ»å¨ä¾¦æµã
å
¶ä»ç¹æ§ï¼æ¯æ Sass, Coffee Scriptã
Twitter Bootstrap
ããBootstrap æ¯åºäº HTMLï¼CSS å JavaScript çç®æ´çµæ´»çæµè¡å端æ¡æ¶å交äºç»ä»¶éï¼ç±å¾®åçå
驱 Twitter å¨2011å¹´8æå¼æºçæ´å¥å端解å³è§£å³æ¹æ¡ãBootstrap æé常å®å¤å详尽çå¼åææ¡£ï¼Web å¼å人åè½å¤è½»æ¾æ建åºæ¸
ç½é£æ ¼ççé¢ä»¥åå®ç°è¯å¥½ç交äºææã
HTML & CSS ç»ä»¶ï¼ ç½æ ¼ï¼å¸å±ï¼æçï¼ä»£ç ï¼è¡¨æ ¼ï¼è¡¨åï¼æé®ï¼å¾åï¼å¾æ ï¼æé®ç»ï¼å¯¼èªï¼é¢å
å±ï¼å页ï¼é项å¡ï¼å¾½ç« ï¼ç¼©ç¥å¾ï¼æéï¼è¿åº¦æ¡ã
JavaScript ç»ä»¶ï¼ è¿æ¸¡ï¼æ¨¡æçªå£ï¼ä¸ææ¡ï¼æ»å¨æ£æµï¼æ ç¾ï¼å·¥å
·æ示ï¼å¼¹åºå±ï¼è¦æ¥ï¼æé®ï¼æé£ç´ï¼æ转æ¨é©¬ï¼èªå¨è¡¥é½ã
å
¶å®ç¹æ§ï¼ æ¯æå®å¶ï¼ LESS CSSã
Skeleton
ããSkeleton æ¯ä¸ä¸ªå°éåç CSS æ件ï¼å¯ä»¥å¸®å©ä½ è¿
éå¼åä»»ä½å°ºå¯¸ï¼å¤è§æ¼äº®çç½ç«ï¼ä¾å¦ç¨äº 17 寸ç¬è®°æ¬çµèå±å¹æ iPhone å±å¹çãSkeleton 建ç«å¨ä¸ä¸ªæ ¸å¿ååä¹ä¸ï¼å
¼å®¹ç§»å¨ç«¯çååºå¼ç½æ ¼ï¼å¿«éå
¥é¨ï¼é£æ ¼æ å
³ãSkeleton 对äºå¤§å¤æ°å¼åè
æ¯ä¸ä¸ªç¸å½ä¸éçéæ©ï¼å 为å®æ¯è½»é级çä¸æäºä½¿ç¨ã
HTML & CSS ç»ä»¶ï¼ ç½æ ¼ï¼æçï¼æé®ï¼è¡¨åï¼åªä½æ¥è¯¢ã
Kube
ããKube æ¯ç± imperavi ï¼ä»ä¹æ¯èåç Redactor ç¼è¾å¨çä½è
ï¼åå¸çå端æ¡æ¶ï¼ä»¥ä½¿è®¾è®¡è
/å¼åè
ççæ´»æ´è½»æ¾ãç®çº¦èä¸ç®åï¼éåºæ§åååºå¼è½å¤ä½¿ç¨åç§éæ±ãé©å½æ§ççµæ´»ç½æ ¼åæ¼äº®çå°å·åä½ï¼æ²¡æä»»ä½å¼ºå çæ ·å¼ã
HTML & CSS ç»ä»¶ï¼æçï¼è¡¨åï¼ç½æ ¼ï¼è¡¨æ ¼ï¼æé®ï¼å¯¼èªï¼å¾æ ã
JavaScript ç»ä»¶ï¼ æé®ï¼æ ç¾ã
å
¶å®ç¹æ§ï¼æ¯æ LESS CSSã
Helium
ããHelium æ¯ä¸ç§å端ååºå¼ Web å¼åæ¡æ¶ï¼ç¨äº HTML5 å CSS3 项ç®çå¿«éåå设计åå®é
å¼åãå®å¨è®¸å¤æ¹é¢ä¸ Twitter Bootstrap å ZURB Foundation ç¸ä¼¼ãç¶èï¼ä¸åäºè¿ä¸¤ä¸ªæ¡æ¶çæ¯ï¼Helium çç®çæ¯è¦æ´è½»éï¼æ´å®¹ææ´æ¹ãæå®çææ¯ä¸ä¸ªå
¸åç汽车ï¼å¨é£éä½ å¯ä»¥æå¼å¼æçï¼å®¹æ对åå¨æºè¿è¡æ¹è£
ã
HTML & CSS ç»ä»¶ï¼ ç½æ ¼ï¼æé®ï¼æçï¼è¡¨æ ¼ã
JavaScript ç»ä»¶ï¼ ä¸ææ¡ï¼è¡¨åéªè¯ï¼æ¨¡æçªå£ã
å
¶å®ç¹æ§ï¼ æ¯æ SASS & Compassã
Markup
ããMarkup æ¡æ¶æ¯ä¸ä¸ªå¸å±ï¼çªå£å°é¨ä»¶ï¼æçæ ·å¼åå
¶ä»ç UI ç»ä»¶çéåï¼å¯ä»¥æ ¹æ®èªå·±çéè¦è¿è¡æ´åã
HTML & CSS ç»ä»¶ï¼å¸å±ï¼ç½æ ¼ï¼æçï¼è¡¨æ ¼ï¼æé®ï¼æ é¢ï¼é¢å
å±ï¼æ¶æ¯ï¼å¯¼èªå表ï¼å¯¼èªèåã
JavaScript ç»ä»¶ï¼ æ Javascriptï¼çº¯ CSSã
Topcoat
ããTopcoat æ¯ä¸ä¸ª CSS éåï¼ç¨äºç®æ´åå¿«éç Web åºç¨ç¨åºå¼åãå®æ¯ä¸ä¸ªå¼æºåºï¼ä¸éè¦ä»»ä½ JavaScript å
ç½®çç¨æ·çé¢å
ç´ ã
HTML & CSS ç»ä»¶ï¼ å¾æ ï¼åä½ï¼æé®ï¼é¢å
å±ï¼æé®æ ï¼è¡¨æ ¼ï¼ä¸æå表ï¼æ»å¨å¼å
³ï¼æ ç¾ï¼åæ¢æé®ï¼éæ©ï¼æ»å
JavaScript ç»ä»¶ï¼ æ Javascript ï¼çº¯ CSS
PureCSS
ããPure æ¯ä¸ç»è½»éçï¼ååºå¼ç CSS 模åï¼æ¨å¯ä»¥ä½¿ç¨å¨ä»»ä½ç Web 项ç®ä¸ãå
åèèäºç§»å¨è®¾å¤ä¸ç使ç¨ï¼ä¿ææ件ä½ç§¯å°½éå°ï¼æ¯è¡ CSS é½è¿è¡äºä»ç»çèèãPure åºäº Normalize.css æ建ï¼å¹¶æä¾å¸å±ä»¥å åç HTML å
ç´ çé£æ ¼ï¼å ä¸æ常è§ç UI ç»ä»¶ãç¸ä¿¡è¿äºé½æ¯ä½ éè¦çã
HTML & CSS ç»ä»¶ï¼ ç½æ ¼ï¼æçï¼è¡¨æ ¼ï¼æé®ï¼è¡¨æ ¼ï¼èåã
JavaScript ç»ä»¶ï¼ æ Javascript ï¼çº¯ CSSã
å
¶å®ç¹æ§ï¼ ç®è¤å¶ä½å¨ï¼YU åºã
温馨提示:答案为网友推荐,仅供参考