這裏顯示兩個版本的差異處。
| Both sides previous revision 前次修改 下次修改 | 前次修改 | ||
|
webdesign:css [2009/05/17 22:55] wenpei |
webdesign:css [2013/09/14 10:13] (目前版本) wenpei |
||
|---|---|---|---|
| 行 1: | 行 1: | ||
| + | ====== W3C CSS ====== | ||
| + | http://www.w3.org/Style/CSS/current-work | ||
| + | |||
| + | Get Started with CSS 3: http://www.webmonkey.com/tutorial/Get_Started_with_CSS_3 | ||
| + | |||
| + | CSS3.info:http://www.css3.info/ | ||
| + | |||
| http://blog.roodo.com/waking_life/archives/4224265.html | http://blog.roodo.com/waking_life/archives/4224265.html | ||
| + | |||
| + | ====== Animation & Transforms ====== | ||
| + | * [[http://tympanus.net/Tutorials/CreativeCSS3AnimationMenus/index.html|Creative CSS3 Animation Menu]] | ||
| + | * http://css3.bradshawenterprises.com/transforms/ | ||
| + | * [[http://tympanus.net/codrops/2013/05/07/a-collection-of-page-transitions/|A Collection of Page Transitions ]] - [[http://tympanus.net/Development/PageTransitions/|Demo]] - [[https://github.com/codrops/PageTransitions|GitHub]] | ||
| + | * [[http://tympanus.net/Development/SidebarTransitions/|Sidebar Transitions]] - Transition effects for off-canvas views | ||
| + | |||
| + | ====== Icon ====== | ||
| + | * [[http://nicolasgallagher.com/pure-css-gui-icons/demo/|Pure CSS GUI icons]] | ||
| ====== do template ====== | ====== do template ====== | ||
| 行 8: | 行 24: | ||
| ====== Top 10 CSS Table Designs ====== | ====== Top 10 CSS Table Designs ====== | ||
| http://www.smashingmagazine.com/2008/08/13/top-10-css-table-designs/ | http://www.smashingmagazine.com/2008/08/13/top-10-css-table-designs/ | ||
| + | |||
| + | [[http://veerle.duoh.com/blog/comments/a_css_styled_table_version_2/|A CSS styled table version 2]] | ||
| ====== 12 Basic CSS Templates ====== | ====== 12 Basic CSS Templates ====== | ||
| 行 66: | 行 84: | ||
| 製作各種欄數的版面。 | 製作各種欄數的版面。 | ||
| + | |||
| + | ====== 區塊垂直置中 ====== | ||
| + | Vertical Centering in CSS:http://www.jakpsatweb.cz/css/css-vertical-center-solution.html | ||
| ====== 讓文章中的照片自動縮圖以符合版面 ====== | ====== 讓文章中的照片自動縮圖以符合版面 ====== | ||
| 行 232: | 行 253: | ||
| background:url(/res/images/up/tab1.gif) no-repeat 1px 0px; /* Style for IE */} | background:url(/res/images/up/tab1.gif) no-repeat 1px 0px; /* Style for IE */} | ||
| 值得注意的是,一定要將xxxx !important 這句放置在另一句之上,上面已經提過 | 值得注意的是,一定要將xxxx !important 這句放置在另一句之上,上面已經提過 | ||
| + | |||
| + | ====== Other ====== | ||
| + | [[http://tjrus.com/iphone|iPhone in pure CSS3]] | ||