<div style="margin: 12px 0px; font-family: arial; color: #333333; background: #ffffff; border: solid 4px #e5e5e5; width: 100%; clear: left;"><div class="CM_CTB_Content_Wrap" style="margin: 0px; padding: 0px;background-color: #ffffff;"><div style="border-bottom: solid 1px #dcdcdc; white-space: nowrap; margin-bottom: 8px; background-color: #eeeeee ;background-image: url(http://clipmarks.com/images/source-bg.gif); background-repeat: repeat-x; height: 24px; line-height: 24px; vertical-align: middle; padding-bottom: 4px; color: #666666; font-size: 10px;" ><a href="http://clipmarks.com/clip-to-blog/" title="see clips that are hot right now"><img src="http://content.clipmarks.com/blog_embed/312a9a7a-d166-43ec-9336-446d9d61b99b/CAF69DBC-63DE-4A20-A97D-61BA01AB226A/" alt="" width="19" height="19" border="0" style="vertical-align: middle; margin: 0px 4px; display: inline; border: none; float:none;" /></a>clipped from <a title="http://eroading.com/web-frontend-develop/50-most-popular-design-posts-tutorials-and-resources" href="http://eroading.com/web-frontend-develop/50-most-popular-design-posts-tutorials-and-resources" style="font-size: 11px;">eroading.com</a></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://eroading.com/web-frontend-develop/50-most-popular-design-posts-tutorials-and-resources"><P>前几天<A href="http://eroading.com/">eRoading</A>介绍了<A href="http://eroading.com/web-frontend-develop/eroading-best-design-resources">75个最佳Web设计资源</A>，现在再向大家推荐另外<A href="http://eroading.com/web-frontend-develop/50-most-popular-design-posts-tutorials-and-resources">50个不错的Web开发设计文章、教程及资源</A>。基中包括CSS技巧、字体、Potoshop、Illustrator使用指南等相关web开发。</p> <H2>Photoshop 资源下载</H2> <P><IMG width="450" height="102" alt="Photoshop Downloads" src="http://eroading.com/wp-content/uploads/2008/12/020646bk8.jpg" title="Photoshop Downloads" /> <SPAN id="more-899"></SPAN></p> <OL> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.webresourcesdepot.com/oriental-photoshop-brushes-and-vector-images-for-mysterious-designs/">具有神秘东方文化的Photoshop画笔和矢量图</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://designm.ag/resources/photoshop-space-brushes/">500+ 太空Photoshop画笔</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://colorburned.com/2008/11/81-amazing-argyle-illustrator.html">81个叫人称奇的菱形画笔</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.gomediazine.com/design-tip/freebie-seamless-swirls/">免费的无缝涡旋</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://designm.ag/resources/photoshop-toolbox/">Photoshop工具箱</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.webdesignerdepot.com/2008/12/video-game-design-between-1990-2008/">1990-2008视频游戏设计</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://blog-well.com/2008/03/04/100-resources-for-web-developers/">100+ 网站开发者必备资源</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://speckyboy.com/2008/11/02/27-indispensable-web-design-and-development-firefox-extensions/">27个网站设计和Firefox 扩展开发必备工具</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://webdesignledger.com/freebies/29-most-useful-texture-packs-of-2008">2008年最实用的29个纹理包</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.bittbox.com/freebies/free-high-res-texture-pack-the-anatomy-of-a-really-old-book/">免费高解析度的纹理包</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://speckyboy.com/2008/12/15/best-ever-65-mootools-plugins-and-demos-is-it-better-than-jquery/">65 个最佳mooTools插件和演示</A></LI> </OL> <H2>CSS</H2> <P><IMG width="450" height="53" alt="CSS Resources" src="http://eroading.com/wp-content/uploads/2008/12/02063607p.jpg" title="CSS Resources" /></p> <OL> <li style="margin-left:16px;padding-left: 0px;"><A href="http://eroading.com/web-frontend-develop/css-framework/" title="Permanent Link to css框架大集合">css框架大集合</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://blog.themeforest.net/general/15-css-tricks-that-must-be-learned/">15个必学的CSS技巧</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://nettuts.com/html-css-techniques/10-challenging-but-awesome-css-techniques/">10个具有挑战性的棒极CSS技术</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://veerle.duoh.com/blog/comments/starting_with_css_and_bug_fixing_tips/">CSS使用和bug修正技巧</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.catswhocode.com/blog/3-ways-to-compress-css-files-using-php">3种用PHP压缩CSS文件的方法</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://css-tricks.com/how-to-resizeable-background-image/">如何调整背景图片的大小</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://cameronmoll.com/archives/2008/02/the_highly_extensible_css_interface_the_series/">高度可扩展的CSS界面系列</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://woork.blogspot.com/2008/11/css-coding-semantic-approach-in-naming.html">CSS编码的命名惯例语法</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.3point7designs.com/blog/2006/09/20/advanced-typography-techniques-using-css/">使用CSS排版的高级技巧</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.marcofolio.net/css/a_parallax_illusion_with_css_the_horse_in_motion.html">利用CSS制造“马在运动”的视差错觉</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://eroading.com/web-frontend-develop/css-tool-save-time/" rel="bookmark" title="Permanent Link to 17个可以节省你时间的CSS工具">17个可以节省你时间的CSS工具</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A target="_blank" href="http://www.webdesignerwall.com/trends/best-of-css-design-2008/">2008 最佳CSS 设计</A></LI> </OL> <H2>字体</H2> <P><IMG width="450" height="63" alt="Typography Resources" src="http://eroading.com/wp-content/uploads/2008/12/020635w7h.jpg" title="Typography Resources" /></p> <OL> <li style="margin-left:16px;padding-left: 0px;"><A href="http://justcreativedesign.com/2008/03/02/30-best-font-downloads-for-designers/">30种设计师必须知道＆拥有的字体</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.3point7designs.com/blog/2008/05/08/8-fonts-you-probably-dont-use-in-css-but-should/">8种在CSS中你应该用而没有用的字体 </A></LI> </OL> <P> </p> <H2>教程</H2> <P><IMG width="450" height="102" alt="Tutorials" src="http://eroading.com/wp-content/uploads/2008/12/02064580u.jpg" title="Tutorials" /></p> <OL> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.blog.spoongraphics.co.uk/tutorials/how-to-create-intense-light-streaks-in-photoshop">如何在</A><A href="http://www.blog.spoongraphics.co.uk/tutorials/how-to-create-intense-light-streaks-in-photoshop">Photoshop中创建高亮倾向图片</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://elitebydesign.com/how-to-master-photoshop-in-just-one-week/">如何在一周内掌握Photoshop</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://psdtuts.com/tutorials/tools-tips/photoshops-pen-tool-the-comprehensive-guide/">Photoshop钢笔工具完全指南</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://sixrevisions.com/photoshop/25-photoshop-tutorials-for-web-designers/">最好的Photoshop教程</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.smashingmagazine.com/2008/12/15/10-useful-techniques-to-improve-your-user-interface-designs/">10种提高用户界面设计（UI）的实用技术</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://sixrevisions.com/rapid-development/10_ajax_effects_website_fanciness">10个提高您网站美观的JavaScript效果</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.smashingmagazine.com/2008/09/11/75-really-useful-javascript-techniques/">75种实用JavaScript技术</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://nettuts.com/web-roundups/20-excellent-ajax-effects-you-should-know/">20种你应该知道的AJAX效果</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.tvidesign.co.uk/blog/improve-your-jquery-25-excellent-tips.aspx">25步提高jQuery</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://psdtuts.com/articles/inspiration/48-mind-blowing-examples-of-photo-manipulation-art/">48种激奋人心的修图艺术</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.youthedesigner.com/2008/01/11/design-a-logo-the-ultimate-guide/">终极Logo设计指南 </A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://veerle.duoh.com/blog/comments/using_the_pathfinder_and_align_tool_in_illustrator/">Illustrator中如何使用路径寻找器和对齐工具</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.layersmagazine.com/category/illustrator/">免费Adobe Illustrator教程</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.vectordiary.com/illustrator/learn-illustrator-cs3-in-30-days/">30天学会Illustrator CS3 </A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://abduzeedo.com/web-design-illustration">网站设计中21个新Illustrations趋势</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://sixrevisions.com/graphics-design/20-exceptional-websites-for-learning-adobe-illustrator/">20个学习Adobe Illustrator的著名网站</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.insidecrm.com/features/101-web-site-fixes-031808/">101个“五分钟修正”逐步改善您的网站</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.blog.spoongraphics.co.uk/articles/25-super-cool-paper-inspired-website-designs">激发网站设计灵感的25个酷站</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.smashingmagazine.com/2008/09/03/40-creative-design-layouts-getting-out-of-the-box/">40个创意设计布局</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.yongfook.com/items/view/81/10-dirty-little-web-development-tricks">10个肮脏的Web开发小伎俩</A></LI> </OL> <H2>图标</H2> <P><IMG width="450" height="80" alt="Icons" src="http://eroading.com/wp-content/uploads/2008/12/020643a3g.jpg" title="Icons" /></p> <OL> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.smashingmagazine.com/2008/07/02/55-free-high-quality-icon-sets/">55个免费高质量图标</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://psdtuts.com/interface-tutorials/handy-web-20-icons-in-photoshop/">用Photoshop手绘Web 2.0图标</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://abduzeedo.com/20-beautiful-hdr-pictures">20张高动态范围图像</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://designreviver.com/freebies/400-high-quality-patterns/">400+高质量图案</A></LI> <li style="margin-left:16px;padding-left: 0px;"><A href="http://www.crazyleafdesign.com/blog/free-vector-downloads-the-largest-collection-of-free-vectors-ever-assembled/">免费矢量图大集合</A></LI></OL></blockquote></div><div style="margin: 0px 6px 6px 4px;"><table style="font-size: 11px;border-spacing: 0px;padding: 0px;" cellpadding="0" cellspacing="0" width="100%"><tr><td style="background:transparent;border-width:0px;padding:0px;">&nbsp;</td><td align="right" style="background:transparent;border-width:0px;padding:0px;width:107px" width="107"><a href="http://clipmarks.com/share/CAF69DBC-63DE-4A20-A97D-61BA01AB226A/blog/" title="blog or email this clip"><img src="http://content6.clipmarks.com/images/c2b-foot.png" border="0" alt="blog it" width="107" height="17" style="border-width:0px;padding:0px;margin:0px;" /></a></td></tr></table></div></div>

New from the makers of Clipmarks:  Amplify.com - Don't just share the news...Amplify it!