虽然有一段时间不做前端工程师，但还是免不了做前端的思维，碰到了很好的前端实用工具帖还是忍不住转了过来。这个帖子被转了好多次了，也不知道原本的作者是谁，但无论是谁都是万分的感谢，没有您的整理也没有大家的方便。
帖子整理了前端工程师常用的工具手册以及一些著名的相关博客，是工作中不可缺少的资料。
概要：
下午要面试一个前端工程师，想了半天不知道出些什么样的题目，除了基础知识的应用，猫嗔觉得还应该考察一下前端对于没有遇到的问题的解决能力。于是上网想搜罗一些复杂而又不常见的题目。（其实面试的时候一下子解决不了问题没关系，因为大家自己做事的时候也知道，不过多n的人，都有可能需要google的时候，关键是看在解决问题中运用的基础知识方向是否正确和处理的方法。）
最终确定的题目就不多说了，但是在搜索中我觉得几个大家广为流传的面试题真的是很不错的，这里整理贴出，算是给去面试的朋友们一个参考。同时也想说，这几个面试题真的也是看基础是不是扎实了。
第一个是迅雷的面试题：
请用css实现下列要求的效果：
1.一个列表包含标题和时间
2.列表宽度固定，高度自由设置
3.时间紧跟标题，但标题过长时需要隐藏。
<!-- ul{list-style:none;} #t1{float:left;overflow:hidden;height:24px; font-size:12px;} ul li{overflow:hidden;line-height:24px;width:200px;} .date{padding-left:10px; font-size:12px; color:#ccc;line-height:24px; position:absolute;} --> <ul> <li> <div id="t1"><a href="#">世界上头发最长的美女</a></div> <span class="date">2009-06-16</span></li> <li> <div id="t1"><a href="#">世界上头美女</a></div> <span class="date">2009-06-16</span></li> <li> <div id="t1"><a href="#">世界上头发最长的世界上头发最长的美世界上头发最长的美世界上头发最长的美世界上头发最长的美世界上头发最长的美美女</a></div> <span class="date">2009-06-16</span></li> <li> <div id="t1"><a href="#">世界上头发最长的美女</a></div> <span class="date">2009-06-16</span></li> <li> <div id="t1"><a href="#">世界上头发最长的美女</a></div> <span class="date">2009-06-16</span></li> <li> <div id="t1"><a href="#">世界上头发最长的美女</a></div> <span class="date">2009-06-16</span></li> <li> <div id="t1"><a href="#">世界上头美女</a></div> <span class="date">2009-06-16</span></li> <li> <div id="t1"><a href="#">世界上头发最长的世界上头发最长的美世界上头发最长的美世界上头发最长的美世界上头发最长的美世界上头发最长的美美女</a></div> <span class="date">2009-06-16</span></li> <li> <div id="t1"><a href="#">世界上头发最长的美女</a></div> <span class="date">2009-06-16</span></li> <li> <div id="t1"><a href="#">世界上头发最长的美女</a></div> <span class="date">2009-06-16</span></li> </ul>
<!-- ul, li {margin:0;padding:0;list-style:none;} ul {float:left; background:#CCC; width:300px;} li {font-size:12px;line-height:1.5em;padding-left:10px;position:relative;height:20px;overflow:hidden;padding-right:65px;} li a {position:relative;left:0px;height:20px;float:left;text-decoration:none;} span {position:absolute;top:0px;right:-65px;} --> <ul> <li><a href="#">天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场<span>2008-08-27</span> </a></li> <li><a href="#">天空一声巨响，超越闪亮全场<span>2008-08-27</span></a></li> <li><a href="#">天空一声巨响，闪亮全场空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场<span>2008-08-27</span></a></li> <li><a href="#">天空一声巨响，超越闪亮全场<span>2008-08-27</span></a></li> <li><a href="#">天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场<span>2008-08-27</span></a></li> <li><a href="#">哈哈哈哈哈哈<span>2008-08-27</span></a></li> <li><a href="#">哈哈哈哈哈哈哈哈哈<span>2008-08-27</span></a></li> <li><a href="#">天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场哈哈哈哈<span>2008-08-27</span></a></li> <li><a href="#">哈哈哈哈哈哈哈哈哈哈<span>2008-08-27</span></a></li> <li><a href="#">天空一声巨响，超越闪亮全场天空一声巨响，超越闪亮全场哈哈哈哈哈哈哈哈<span>2008-08-27</span></a></li> </ul>
<!-- *{margin:0;padding:0;} #muem ul{background:#FFC;width:310px;} #muem ul li{margin:5px;height:30px;line-height:30px;text-align:left;list-style:none;width:300px;overflow:hidden;display:inline-block;} #muem ul li a{font-size:12px;float:left;padding-right:60px;} #muem ul li span{color:#CCCCCC; font-family:Tahoma, Geneva, sans-serif; font-size:12px;display:inline-block;float:left;margin-left:-50px;} --> <div> <div id="muem"> <ul> <li><a>杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练杂技团美女演员的训练</a><span>2008-07-14</span></li> <li><a>最昂贵内衣惊艳出炉</a><span>2008-07-14</span></li> <li><a>[组图]让人喷饭的日喷饭的日</a><span>2008-07-14</span></li> <li><a>世界上头发最长的美女：人惊奇的</a><span>2008-07-14</span></li> <li><a>世界八大最喜欢吃人的的虹顺利产</a><span>2008-07-14</span></li> <li><a>亿万富翁的超级奢侈</a><span>2008-07-14</span></li> <li><a>日本小姐选美</a><span>2008-07-14</span></li> <li><a>素面朝天吓坏人，化妆虹顺利产</a><span>2008-07-14</span></li> </ul> </div> </div>
关键字：AXURE 5.6 正式发布 下载 注册码 推荐原型工具
不知道从什么时候，所有中国的产品经理们都成为axure的铁杆fans，axure也要快速的开发和更新，才能满足我们对他的期待。
带着众多的不便和bug的反馈，axure终于更新到了5.6版本。
这个新版是带点的新版本号，自然没有质的飞跃，但也还是有些特别的东西让我们欣喜的。
1.首先是对图片的处理。5.6版对可以对导入的图片再进行一次裁切。裁切的方式还有三种。
操作：选中图片–》右键单击–》【edit image】–》【slice image】
这是一个图片再编辑的功能，想法不错，但是个人认为，工具中裁切的方式很不符合习惯，有点诡异，期待改进。
2.其次是随时随地可以将随用的元素变成组件或者是动态层组件中的部分，这个功能应该是本次升级的最大亮点了。
操作：选中某元素或者元素组–》右键单击–》【convert】–》【convert to master】or【convert to dynamic panel】
3.据说这个版本的协作功能也做了改进，我还没有试用，但对改进充满期待。
好啦不多说啦，发两个下载地址：
http://axure.cachefly.net/AxureRP-Pro-Setup.exe
http://www.axure.com/files/AxureRP-Pro-Setup.exe
其实这个地址是越过注册填写表单的步骤得到的地址，并且是最新版本的地址，大家可以一直搜藏，只要有新版本就用这个地址下载即可。
放个注册号，所有版本都通用的：
Name：3ddown
Serial：FiCGEezgdGoYILo8U/2MFyCWj0jZoJc/sziRRj2/ENvtEq+7w1RH97k5MWctqVHA
其实不要太依赖工具，工具会束缚我们的思想。不要让产品经理去做太多的技术和设计方向的工作，我们应该专注我们的业务方向。
今天选择了一些做uml的工具，首先下载了Enterprise Architect 试用，感觉功能不错，工具也很小巧，比Rational Rose要实用很多。
uml本来是在软件设计中必不可少的一个工具，但随着网络产品（网站）的不断复杂化，uml也逐渐成为项目中需要的环节，能清晰的分析逻辑和脉络。
其实uml就是我们平时说的线框图，有人用viso有人用word，但是你会发现用uml规范，会有更多的优势。
太多的不说了，其实主要是今天下了一个EA的汉化版本，并找到了序列号（许可证注册码）。帖出来供大家学习时参考使用。当然我们应该保护版权，仅供学习和个人使用。
Enterprise Architect 7.5 原版+汉化修复版迅雷下载地址（复制到迅雷的新建任务弹出框中）：thunder://QUFodHRwOi8vZG93bjguY2F0bWFvbWFvLmNvbS8vZG93bmxvYWQ4Ly8yMDA5LTA3LzI5L0VBNzVDTi1GVUxMLWZpeC56aXBaWg==
Enterprise Architect 7.5注册码
Name:whitehouse.net.cn
Company:eric
注册码:67SC0O95-SZPS-LIG2-YQ8Q-8D2N-KWTD-0W6R-TWDD-KT6RB-1J
Enterprise Architect 7.1注册码
Name:whitehouse.net.cn
Company:whitehouse.net.cn
注册码:GLAOMULN-N1F1-EGBC-XN52-9QC6-GJGJ-0W6R-TWDD-KT6RB-SQ
最新评论