html-css-js的几款前端开发工具

一、介绍2款前端小工具【取色工具和量距离工具】

 

 

1.取色工具——TakeColor

 

 

2.量距离工具(像素)

 

 

介绍下载请参见:http://www.css88.com/article.asp?id=483

 

 

 

 

二、JavaScript调试器VenKmanfirefox插件】

 

 

 

 

 

 

三、IE WebDeveloper V2.3.2.108点击下载

 

 

   一款用于IE浏览器的插件,允许直接地在浏览器窗口中浏览、传输和更新HTML DOM。该软件可以实时分析网页并且显示为一种允许你察看表格风格、Java脚本,表格以及其它网页元素的树形风格。该软件还可以在浏览器中交互式地突出显示被选择的网页元素,因此你可以在实际网页中定位其代码。

 

 

其详细介绍见:IE DOM查看工具,IE Web Developer V2 破解版本

 

 

注册码:88ZWT-71C2D4E621BD3D4A

 

 

 

 

 

四、Fiddler

 

 

一个很强大的http流查看工具

 

 

http://www.fiddlertool.com/fiddler/

 

 

 

 

 

五、Httpwatch

 

 

数据分析工具,头消息接受/发送的查看,POST数据查看.等等

 

 

http://www.httpwatch.com

 

 

 

 

六、IE Developer Toolsbar

 

 

IE下的FireBug.HTMLCSS调试工具

 

 

http://www.windowsmarketplace.com/details.aspx?itemid=2695980

 

 

 

 

七、Companion.JS

 

 

IE下的javascript调试工具.福音啊!

 

 

http://www.my-debugbar.com/wiki/CompanioNJS/HomePage

 

 

 

 

八、FireBug

 

 

强的没话说了已经....如果你不知道这是什么....那我更没话说了

....

 

 

https://addons.mozilla.org/en-US/firefox/addon/1843

 

 

 

 

九、

Web Developer

 

 

FireFox

下的查看工具,可以查看JS,CSS等页面信息

 

 

https://addons.mozilla.org/en-US/firefox/addon/60

 

 

 

 

十、YSlow

 

 

why slow?

页面性能优化查看器.基于FireBug

 

 

http://developer.yahoo.com/yslow

 

 

 

 

十一、Javascript Debugger

 

 

FireFox下的javascript调试工具,FireBug有更强大的调试功能.

 

 

https://addons.mozilla.org/en-US/firefox/addon/216

 

 

 

 

十二、JavaScript 压缩工具

 

 

这程序是由Mike Hall写的,JavaScript的压缩不是为了保护代码而压缩,而是压缩后的js代码文件可以小一倍甚至多倍,从而使这个js代码快速的下载到客户端,特别js文件较大时速度效果非常明显. 使用方法:

 

 

 

使用下面的表单,你可以浓缩JavaScript代码.只用将任何脚本代码粘贴到输入的文本框,压下 '压缩' 按钮,那浓缩的版本就出现在 '输出' . 然后你可以使用 '全选' 按钮,快速选中'输出'里的代码,剪切粘贴到一个新的源码文件.

 

 

点击查看: http://www.css88.com/ysjs/ysjs.html

 

 

转载请注明出处:

http://www.css88.com/

 

 

 

 

十三、前端开发工具箱——抓色工具(ColorPic)

 

 

名称:ColorPic

 

 

大小:400k

 

 

下载地址:http://www.css88.com/article.asp?id=182

 

 

备注:绿色,解压即可使用。

 

 

特点:

 

 

有方案的概念,可以建立多组方案。

 

 

强大的色盘功能,多种方式可以选择。

 

 

吸色时,局部放大(放大比率可以自己调整),方便抓取细微部分的颜色。

 

 

使用Ctrl+G快捷键取色。

 

 

截图:

 

 

 

 

 

 

十四、XHTMLCSS、标准代码检测

 

 

做网页的朋友应该都去过

 

 

 http://validator.w3.org/ http://jigsaw.w3.org/css-validator/。现在有人把他们集成到了一起,搞了一个网站叫 XHTML-CSS Validator,点击旁边的 “Advanced” ,还可以选择校验文档类型、CSS版本等等,有兴趣可以试试。

 

 

 

 

十五、火狐插件

 

 

前台开发我认为必装的火狐插件

 

 

1.CSSViewer 1.0.2

 

 

 

看具体DOMCSSWeb开发者可以用。

 

 

2.Firebug 1.05

 

 

 

调试JS的利器,同时也可进行一些简单的DOM Hook。特爽。

 

 

唯一的缺陷就是狂吃资源,如果不是Debug时间,最好把它disable

 

 

3.JSView 1.2.9

 

 

 

我人为非常重要的,可以查看当前页面的外埠jscss,这对开发者来说很重要。

 

 

4.Web Developer 1.1.3

 

 

功能上可能跟Firebug有一些重叠,但是也很强大

 

 

 

 

十六、flash

破解——ASV

 

 

Action Script Viewer

(简称ASV) 可以分析 Flash 文件(.swf)文件的内部结构,并将其中的动作脚本(action scripts)分解出来,软件支持 Flash 3 4 5 及最新的 MX 制作的 swf 文件,分解出的动作脚本可以保存为文本格式,在编辑过程中可以随时对 Flash 文件进行预览。4.0版支持Macromedia Flash 4, 5 , MX , MX 2004flash 8 SWF 文件。

 

 

ASV5

详细教程

 

 

1.

Action Script Viewer 5.0 中打开要"还原".swf文件。

 

 

2.

文件菜单 > 导出重建数据

 

 

file > Export Rebuild data(JSFL)

 

 

 

3.

导出数据到指定文件夹

 

 

4.

打开Flash, 新建Flash文件, 将刚才文件夹中的SWF/MP3/WAV/FLV文件全部导入到库中(不要导入到场景

 

 

5.

确认后保存文件, 将文件命名为"rebuild.fla" . 目的是于.jsfl文件同名 . 保存后关闭该文件。

 

 

6.

然后打开"rebuild.jsfl"文件 (不要从Flash中用打开命令, 简单的方法是从文件夹中双击,此时Flash的时间轴/工具栏哗啦啦的闪)

 

 

保存该FLA文件, 然后用Ctrl+Enter发布。

 

 

Action Script Viewer 5.0

可以还原flash8swf

 

 

目前可供下载的最高版本:

Action Script Viewer v5.01(点击下载)

 

 

 

 

十七、CSS整形工具——使用CSSTidy 1.2

 

 

我们在写CSS样式的时候通常会根据自己的一些习惯来写,比如有些时候不会使用样式缩写,样式格式随意,大小写不分(另存下来的样式是大写的)等等;晚上有一种CSS整形工具叫CSSTidy 1.2大家可以使用一下,可以优化你写的样式,特备是节省字节方面效果显著;点击进入CSS整形工具CSSTidy 1.2

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

前端颜色拾取器takecolor是一种用于在网页设计过程中选择颜色的工具。它可以帮助前端开发人员快速准确地选择网页元素的颜色,从而优化用户体验。 takecolor具有以下主要特点和功能: 1. 界面简洁直观:takecolor的界面设计简洁直观,用户可以轻松地找到所需的功能。 2. 色彩选择多样:takecolor提供了多种选择颜色的方式,如拾取器、调色板、自定义颜色等。用户可以根据需求选择不同的色彩选择方式。 3. 色彩信息显示:takecolor可以实时显示选择的颜色的色值信息,包括RGB、HEX、HSL等,方便开发人员快速记录和应用到代码中。 4. 预览功能:takecolor可以实时预览所选择的颜色在网页中的效果,让用户更直观地了解颜色的呈现效果。 5. 历史记录:takecolor可以保存用户选择的颜色历史记录,方便用户在以后的使用过程中快速找到之前使用过的颜色。 6. 互动性:takecolor提供了一些额外的交互功能,如缩放颜色选择器、调整颜色饱和度和亮度等,使用户可以根据实际需求对颜色进行微调。 7. 跨平台兼容性:takecolor可以在不同的操作系统和浏览器上运行,具有较好的跨平台兼容性,方便用户在不同的环境下使用。 总之,前端颜色拾取器takecolor是一款功能齐全、易用性强的工具,能够帮助前端开发人员快速准确地选择网页元素的颜色,提升网页设计的效果和用户体验。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值