阅读更多

25顶
0踩

Web前端
作为前端开发人员来说,我们需要和HTML、CSS和JavaScript打交道,并且需要不停的突破自己的创意极限来开发和设计最棒的交互场景。

很多资深的前端设计师都拥有自己最喜欢的工具、脚本和资源,在今天这篇文章中,我们将介绍一些能够帮助你高效开发的工具脚本和资源,权当抛砖引玉,希望能够带给大家帮助,如果你也有自己喜欢的好东西,请给我们留言,希望能够让更多的朋友了解。

1.  JSFIDDLE

JSFIDDLE是一个超棒的在线JS/CSS/HTML调试和分享工具,大家可以方便的在web页面中分享代码,或者调试代码。并且有效的和同事或者朋友分享。



2.  JSBin

JSbin是另外一个相当不错的在线调试和分享网站,和JSFIDDLE非常类似,但是整体界面更偏重于编辑和调试。你拥有更大的编辑区域,而且拥有控制台可以查看错误。



3.  HTML/CSS/Javascript的在线开发工具 - Fiddle Salad

超棒的HTML/CSS/Javascript的在线开发工具,如果你使用过JSFIDDLE的话,相信大家会更喜欢这个功能强大的在线整合开发环境。



4.  Tinkerbin

另外一个在线调试和演示前端开发工具,和jsfiddle比较起来,TinkerBin界面功能比较简答,但是界面布局更加合理。使用jsfiddle的时候,总感觉每一个窗口的输入都比较费劲,用户不得不来回的拖拉窗口。而使用Tinkerbin, 你可以更加容易的切换多个窗口或者单一个窗口来浏览器CSS、HTML或者JS代码。



5.  Browser Support

作为一个前端开发者来说,处理不同浏览器的兼容性问题如同家常便饭,但是如果让你说出不同浏览器的CSS兼容性区别,还真不太容易,这里介绍的这个工具Browser Support,可以很方便的告诉你不同浏览器下的CSS区别以及是否被支持。相当的方便!



6.  openwebicon

如果你厌倦了图片生成的图标的话,使用openwebicon是一个不错选择,你只需要添加class即可生成需要的图标。



7.  gradient-scanner

这个工具超酷,能够帮助你将上传图片中的渐变特效生成CSS样式,非常便捷和高效,也非常实用。



8.  Em Calculator

Em calculator是一个轻巧的JavaScript工具,能够帮助你创建灵活的CSS设计。它帮助你转换像素到em单位。可以帮助你有效的查看、比对像素和字体大小。



9.  CSS ARROW PLEASE!

一个在线的、简单实用的生成气泡式提示的web工具。



10.  checkmycolours

一个帮助你检查网站颜色对比度的工具,能够有效的帮助你设计搭配完美的颜色方案。



11.  Screenqueri.es

如果你需要开发响应式布局设计的网站的话,这个工具肯定能够帮你大忙,它能够模拟不同设备的屏幕尺寸,并且帮助你占线不同设计上的网站显示效果,绝对是测试必备工具。



12.  Dirty Markup

如果你需要一个帮助你规整书写混乱的代码的工具的话,我强烈推荐给你这个在线代码美化工具。这个在线工具能够帮助你有效的处理HTML/HTML5、CSS和JavaScript代码。



13.  jQuery mobile原型设计开发工具 - codiqa

一个超棒的在线原型设计开发工具,这个在线设计工具能够帮助我们快速的使用拖拽的方式来构建一个基于jQuery mobile的web应用程序。



14.  Screenfly

Screenfly是一个免费测试工具,可以用来测试不同客户端下(不同显示器或者移动设备)网站显示状况的工具。它使用一个代理服务器来模拟设备,并且支持最流行的平板电脑或者移动设备。



15.  Fixie

fixiejs是一个超实用的虚构内容生成脚本,如果你设计网站或者网页,往往需要添加一些文字或者图片内容来查看效果,这个脚本可以有效的帮助你生成不同类型内容,让你专注于设计本身!



16.  SimpleCart

超酷的纯JavaScript实现的购物车程序,能够很有效的帮助你生成一个B2C购物车。简单、实用、快捷!



17.  Animate.css

animate.css 是一套超棒的CSS动画脚本,可以帮助你使用CSS实现各种类型的动画,不同的淡入、淡出,或者旋转、翻转特效。绝对是帮助你快速生成特效的好工具,你可以通过使用jQuery的addClass来给你的元素添加特效,方便实用,非常易于整合。 相信你一定会喜欢的!



18.  Redactor - HTML富编辑器

基于jQuery的一个超棒WYSIWYG编辑器。这个编辑器使用jQuery技术作为框架开发完成,整合了很多炫酷的功能,比如,拖拽上传文件、自动保存等,速度很快,并且体积非常小。



19.  jqueryboilerplate

jQuery Boilerplate是一个不错的jQuery插件开发工具,使用这个工具可以帮助你快速的构建一个jQuery插件。



来自: www.gbin1.com
25
0
评论 共 13 条 请登录后发表评论
13 楼 cy小囡囡 2012-08-27 16:51
刚开始学做前端,有的时候都不知道怎么调试,这个很有用啊!
12 楼 newsletterBroker 2012-08-13 13:44
chaoqiang
11 楼 kamarl 2012-08-11 08:03
都是不错的工具
10 楼 whrlmc 2012-08-10 22:55
checkmycolours 还有点意思
9 楼 fws4072967625 2012-08-10 16:09
看完了全部工具...有些工具还是不适合,checkmycolours 这个工具把所有的字体颜色都显示了....不方便,不过有很多我都保存地址了,以后有机会再用
8 楼 supperbbq 2012-08-10 12:16
很好!
7 楼 mybreeze77 2012-08-10 12:07
哪些是免费的?
6 楼 lingfa0511 2012-08-10 09:49
不错,每个都看了,非常喜欢。。。
5 楼 xchd 2012-08-09 17:23
很强,但玩玩可以
4 楼 damoqiongqiu 2012-08-09 17:03
不错,回头来试一下子,看看能不能淘到一件顺手的兵器
3 楼 hehebaiy 2012-08-09 16:47
很不错啊~~!!!! 
2 楼 ylzyd12345 2012-08-09 16:35
一个字Cooooooooooooooooooooooool
1 楼 witcheryne 2012-08-09 16:22
兄弟, 终于把文章发全了!

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 14个高效前端开发所必备的工具/脚本推荐(转载)

    很多资深的前端设计师都拥有自己最喜欢的工具、脚本和资源,在今天这篇文章中,我们将介绍一些能够帮助你高效开发的工具脚本和资源,权当抛砖引玉,希望能够带给大家帮助,如果你也有自己喜欢的好东西,请给我们留言...

  • 分享一些前端开发人员必备的工具,脚本和资源

    作为前端开发人员来说,我们需要和HTML、CSS和JavaScript打... 很多资深的前端设计师都拥有自己最喜欢的工具、脚本和资源,在今天这篇文章中,我们将介绍一些能够帮助你高效开发的工具脚本和资源,权当抛砖引玉,...

  • 12个前端开发必备开发的工具

    在这篇文章中,我们向您展示了一个将工具和服务分类为bucket的框架,它可能会在前端开发过程中对您有所帮助。在每个类别中,我们都会讨论一个受欢迎的选择,同时也会给您一个可供选择的选择,以防您不同意我们最初的...

  • 高阶前端开发人员必备工具-Node.JS知识讲解

    想要成为一个“值钱”的高阶Web前端开发人才,Node.JS是必须要掌握的技术之一。今天小千就为大家详细讲解Node.JS的知识,让你完全了解Node.JS的前世今生。 1、说起Node.js你了解多少呢? Node.js是一个基于Chrome ...

  • Web前端开发必备工具推荐

    http://gaohaixian.blog.163.com/blog/static/12326010520114265223489/不管你做前端开发还是网页重构,前端工具都起...1.前端开发必备工具之辅助开发工具篇 在这里推荐一些前端开发中可以是你提高开发效率的小工具...

  • 【建议收藏】前端开发必备文档(持续更新中...)

    记录前端学习的技术栈

  • 2019年20种程序员必备前端Web开发工具

    许多前端开发工具可以加速Web开发。以下是包含主要功能和下载链接的顶级工具的精选列表。 1)Npm: Npm是JavaScript的Node包管理器。它有助于发现可重用代码的包并以强大的新方式组装它们。此Web开发工具是一个...

  • 这12个前端在线工具网站,建议每个开发人员了解下

    尽管前端网站开发可能会具有挑战性,但并不一定非常困难。...希望这些资源能够帮助您更好地完成前端开发工作。1. CanIUsecaniuse.com是一个流行的网站,它提供了关于不同Web技术的浏览器兼容性信息。该网站列...

  • 2019年如何高效学习前端开发?

    近两年来,前端开发工程师越来越火了, 2019年已经到来了,很多准备入行前端开发工程师的小伙伴们,不知道...今天来给大家讲讲,在2019年,我们学习前端开发,如何才能高效学会前端开发? 零基础起步 首先,无论...

  • web前端开发必备工具推荐

    1.前端开发必备工具之辅助开发工具篇 在这里推荐一些前端开发中可所以你提高开发效率的小工具,既小巧又方便; SuperPreview微软的网页开发调试利器 FastStone Capture 次要用途:截图,取色

  • 一名合格的Web前端开发工程师少不了这10款开发工具

    正所谓“工欲善其事必先利其器”,一名合格的Web前端开发工程师自然会用到不少能使其工作高效的工具。下面,我就给大家分享学习Web前端需要了解的十款HTML5开发工具。 1、Lungo Lungo是一款基于HTML5的开发框架,专...

  • spring-ai-bedrock-converse-1.0.0-M7.jar中文文档.zip

    # 【spring-ai-bedrock-converse-1.0.0-M7.jar中文文档.zip】 中包含: 中文文档:【spring-ai-bedrock-converse-1.0.0-M7-javadoc-API文档-中文(简体)版.zip】 jar包下载地址:【spring-ai-bedrock-converse-1.0.0-M7.jar下载地址(官方地址+国内镜像地址).txt】 Maven依赖:【spring-ai-bedrock-converse-1.0.0-M7.jar Maven依赖信息(可用于项目pom.xml).txt】 Gradle依赖:【spring-ai-bedrock-converse-1.0.0-M7.jar Gradle依赖信息(可用于项目build.gradle).txt】 源代码下载地址:【spring-ai-bedrock-converse-1.0.0-M7-sources.jar下载地址(官方地址+国内镜像地址).txt】 # 本文件关键字: spring-ai-bedrock-converse-1.0.0-M7.jar中文文档.zip,java,spring-ai-bedrock-converse-1.0.0-M7.jar,org.springframework.ai,spring-ai-bedrock-converse,1.0.0-M7,org.springframework.ai.bedrock.converse,jar包,Maven,第三方jar包,组件,开源组件,第三方组件,Gradle,springframework,spring,ai,bedrock,converse,中文API文档,手册,开发手册,使用手册,参考手册 # 使用方法: 解压 【spring-ai-bedrock-converse-1

  • 房地产 -可视化管理课件.ppt

    房地产 -可视化管理课件.ppt

  • tokenizers-0.18.0.jar中文-英文对照文档.zip

    # 【tokenizers-***.jar***文档.zip】 中包含: ***文档:【tokenizers-***-javadoc-API文档-中文(简体)版.zip】 jar包下载地址:【tokenizers-***.jar下载地址(官方地址+国内镜像地址).txt】 Maven依赖:【tokenizers-***.jar Maven依赖信息(可用于项目pom.xml).txt】 Gradle依赖:【tokenizers-***.jar Gradle依赖信息(可用于项目build.gradle).txt】 源代码下载地址:【tokenizers-***-sources.jar下载地址(官方地址+国内镜像地址).txt】 # 本文件关键字: tokenizers-***.jar***文档.zip,java,tokenizers-***.jar,ai.djl.huggingface,tokenizers,***,ai.djl.engine.rust,jar包,Maven,第三方jar包,组件,开源组件,第三方组件,Gradle,djl,huggingface,中文API文档,手册,开发手册,使用手册,参考手册 # 使用方法: 解压 【tokenizers-***.jar***文档.zip】,再解压其中的 【tokenizers-***-javadoc-API文档-中文(简体)版.zip】,双击 【index.html】 文件,即可用浏览器打开、进行查看。 # 特殊说明: ·本文档为人性化翻译,精心制作,请放心使用。 ·只翻译了该翻译的内容,如:注释、说明、描述、用法讲解 等; ·不该翻译的内容保持原样,如:类名、方法名、包名、类型、关键字、代码 等。 # 温馨提示: (1)为了防止解压后路径太长导致浏览器无法打开,推荐在解压时选择“解压到当前文件夹”(放心,自带文件夹,文件不会散落一地); (2)有时,一套Java组件会有多个jar,所以在下载前,请仔细阅读本篇描述,以确保这就是你需要的文件; # Maven依赖: ``` <dependency> <groupId>ai.djl.huggingface</groupId> <artifactId>tokenizers</artifactId> <version>***</version> </dependency> ``` # Gradle依赖: ``` Gradle: implementation group: 'ai.djl.huggingface', name: 'tokenizers', version: '***' Gradle (Short): implementation 'ai.djl.huggingface:tokenizers:***' Gradle (Kotlin): implementation("ai.djl.huggingface:tokenizers:***") ``` # 含有的 Java package(包): ``` ai.djl.engine.rust ai.djl.engine.rust.zoo ai.djl.huggingface.tokenizers ai.djl.huggingface.tokenizers.jni ai.djl.huggingface.translator ai.djl.huggingface.zoo ``` # 含有的 Java class(类): ``` ai.djl.engine.rust.RsEngine ai.djl.engine.rust.RsEngineProvider ai.djl.engine.rust.RsModel ai.djl.engine.rust.RsNDArray ai.djl.engine.rust.RsNDArrayEx ai.djl.engine.rust.RsNDArrayIndexer ai.djl.engine.rust.RsNDManager ai.djl.engine.rust.RsSymbolBlock ai.djl.engine.rust.RustLibrary ai.djl.engine.rust.zoo.RsModelZoo ai.djl.engine.rust.zoo.RsZooProvider ai.djl.huggingface.tokenizers.Encoding ai.djl.huggingface.tokenizers.HuggingFaceTokenizer ai.djl.huggingface.tokenizers.HuggingFaceTokenizer.Builder ai.djl.hu

  • 基于MATLAB的BP神经网络预测模型构建与应用

    内容概要:本文详细介绍了如何使用MATLAB构建和应用BP神经网络预测模型。首先,通过读取Excel数据并进行预处理,如归一化处理,确保数据的一致性和有效性。接着,配置网络结构,选择合适的训练算法(如SCG),设置训练参数(如最大迭代次数、目标误差等)。然后,进行模型训练,并通过可视化窗口实时监控训练过程。训练完成后,利用测试集评估模型性能,计算均方误差(MSE)和相关系数(R²),并通过图表展示预测效果。最后,将训练好的模型保存以便后续调用,并提供了一个简单的预测函数,确保新数据能够正确地进行归一化和预测。 适合人群:具有一定MATLAB基础,从事数据分析、机器学习领域的研究人员和技术人员。 使用场景及目标:适用于需要对多维数据进行预测的任务,如电力负荷预测、金融数据分析等。主要目标是帮助用户快速搭建一个可用的BP神经网络预测系统,提高预测准确性。 其他说明:文中提供了完整的代码框架和详细的注释,便于理解和修改。同时,强调了数据预处理的重要性以及一些常见的注意事项,如数据量的要求、归一化的必要性等。

  • tokenizers-0.22.1.jar中文-英文对照文档.zip

    # 【tokenizers-***.jar***文档.zip】 中包含: ***文档:【tokenizers-***-javadoc-API文档-中文(简体)版.zip】 jar包下载地址:【tokenizers-***.jar下载地址(官方地址+国内镜像地址).txt】 Maven依赖:【tokenizers-***.jar Maven依赖信息(可用于项目pom.xml).txt】 Gradle依赖:【tokenizers-***.jar Gradle依赖信息(可用于项目build.gradle).txt】 源代码下载地址:【tokenizers-***-sources.jar下载地址(官方地址+国内镜像地址).txt】 # 本文件关键字: tokenizers-***.jar***文档.zip,java,tokenizers-***.jar,ai.djl.huggingface,tokenizers,***,ai.djl.engine.rust,jar包,Maven,第三方jar包,组件,开源组件,第三方组件,Gradle,djl,huggingface,中文API文档,手册,开发手册,使用手册,参考手册 # 使用方法: 解压 【tokenizers-***.jar***文档.zip】,再解压其中的 【tokenizers-***-javadoc-API文档-中文(简体)版.zip】,双击 【index.html】 文件,即可用浏览器打开、进行查看。 # 特殊说明: ·本文档为人性化翻译,精心制作,请放心使用。 ·只翻译了该翻译的内容,如:注释、说明、描述、用法讲解 等; ·不该翻译的内容保持原样,如:类名、方法名、包名、类型、关键字、代码 等。 # 温馨提示: (1)为了防止解压后路径太长导致浏览器无法打开,推荐在解压时选择“解压到当前文件夹”(放心,自带文件夹,文件不会散落一地); (2)有时,一套Java组件会有多个jar,所以在下载前,请仔细阅读本篇描述,以确保这就是你需要的文件; # Maven依赖: ``` <dependency> <groupId>ai.djl.huggingface</groupId> <artifactId>tokenizers</artifactId> <version>***</version> </dependency> ``` # Gradle依赖: ``` Gradle: implementation group: 'ai.djl.huggingface', name: 'tokenizers', version: '***' Gradle (Short): implementation 'ai.djl.huggingface:tokenizers:***' Gradle (Kotlin): implementation("ai.djl.huggingface:tokenizers:***") ``` # 含有的 Java package(包): ``` ai.djl.engine.rust ai.djl.engine.rust.zoo ai.djl.huggingface.tokenizers ai.djl.huggingface.tokenizers.jni ai.djl.huggingface.translator ai.djl.huggingface.zoo ``` # 含有的 Java class(类): ``` ai.djl.engine.rust.RsEngine ai.djl.engine.rust.RsEngineProvider ai.djl.engine.rust.RsModel ai.djl.engine.rust.RsNDArray ai.djl.engine.rust.RsNDArrayEx ai.djl.engine.rust.RsNDArrayIndexer ai.djl.engine.rust.RsNDManager ai.djl.engine.rust.RsSymbolBlock ai.djl.engine.rust.RustLibrary ai.djl.engine.rust.zoo.RsModelZoo ai.djl.engine.rust.zoo.RsZooProvider ai.djl.huggingface.tokenizers.Encoding ai.djl.huggingface.tokenizers.HuggingFaceTokenizer ai.djl.huggingface.tokenizers.HuggingFaceTokenizer.Builder ai.djl.hu

  • 基于蒙特卡洛算法的电动汽车对IEEE 33节点电网影响的研究及应用场景分析

    内容概要:本文探讨了电动汽车(EV)对IEEE 33节点电网的影响,特别是汽车负荷预测与节点潮流网损、压损计算。通过蒙特卡洛算法模拟电动汽车负荷的时空特性,研究了四种不同场景下电动汽车接入电网的影响。具体包括:负荷接入前后的网损与电压计算、不同节点接入时的变化、不同时段充电的影响以及不同负荷大小对电网的影响。通过这些分析,揭示了电动汽车充电行为对电网的具体影响机制,为未来的电网规划和优化提供了重要参考。 适合人群:从事电力系统研究的专业人士、电网规划工程师、电动汽车行业从业者、能源政策制定者。 使用场景及目标:①评估电动汽车大规模接入对现有电网基础设施的压力;②优化电动汽车充电设施的布局和运营策略;③为相关政策和技术标准的制定提供科学依据。 其他说明:文中提供的Python代码片段用于辅助理解和验证理论分析,实际应用中需要更复杂的模型和详细的电网参数。

  • 房地产 -【万科经典-第五园】第五园产品推介会.ppt

    房地产 -【万科经典-第五园】第五园产品推介会.ppt

  • 稳压器件.SchLib

    稳压器件.SchLib

  • 1.jpg

    1

Global site tag (gtag.js) - Google Analytics