网页教学网收集20个方便网页开发的工具

Typetester

开发的工具-网页收集工具">

一个在线对比字体的工具,可以很直观得看到不同字体的差异

pForm



创建HTML表单的工具,能在瞬间创建很美观的表单,并输出html代码

ColourLovers



在线的调色板工具,你能够搜索到很多配色方案或提交你的配色方案

Firebug



无所不能的firebug,不多介绍了

HTML Entity Character Lookup



HTML 实体 查询工具

960 Grid System



960 是个神奇的数字,960 是横向尺寸,960 网格系统是能够让设计师快速创建网页原型的辅助系统。可以比喻成网页的黄金分割线

 

 

 

Em Calculator



EM换算器~ ,可以把像素换算成 em 单位。

Browser Shots



多浏览器截屏工具,可以提供多个平台,不同浏览器的页面截屏效果

Icon Finder



还在为找图标发愁么,一个不错的图片搜索工具。

WhatTheFont



当你图片里看到一个好看的文字而不知道字体名称时,可以用它来帮你分析字体类型

MeasureIt



firefox插件,可以在页面上显示一个尺子

ColorZilla



同样是firefox插件,可以在页面上取色,前端开发必备

Pingdom



一个在线的抓包工具

Test Everything



Test Everything 提供了很多测试工具来测试你的站点。从css html 到seo ,从网络工具到优化应有尽有。

CSS Sprite Generator



样式精灵,这类工具很多了,就是把图片分割并且输出成css

Web Developer Toolbar



也是一个非常强大的web开发工具。

Domainr



域名查询工具,很方面查询域名的使用情况,并且给出未注册域名的建议。(需要翻墙)

Font Burner



字体查询工具,并且提供在线的字体解决方案。仅限英文。

Smush.It



图片优化工具,能够优化你的图片尺寸

Load Impact



可以模拟不同地区的用户访问你的站点的情况。并且以图表的情况反馈结果。

时间: 2024-10-27 09:17:50

网页教学网收集20个方便网页开发的工具的相关文章

网页教学网收集整理网上最有趣的404页面

文章描述:极富创意的404页面. 每当人们打错了网址,熟悉的404页面就会映入眼帘.多数网站的404页面很让人扫兴,一味的跳转回网站的主页.但有一些聪明的公司把404页面也设计的其乐融融.本文收集了国外一些网上最有趣的404页面.几年前Tristan Walker就在问答网站Quora上开始收集有趣的404页面.加上一些Mashable上的贡献,我们汇集了一些最具有创意的404页面. 哎呦!TechCrunch科技博客把404页面做成了掉裤子的囧人. 在有的404页面上还能玩吃豆人呢. 这款40

网页教学网代码分享:干净简洁的网页列表代码

文章简介:网页教学网代码分享:干净简洁的网页列表代码.  谁不希望有一个好看而又干净的网页列表?这篇文章中我们给出几个实用的例子,你可以把他们直接用到自己的工作中. 我们从一个带有动画效果的垂直列表开始,接着是一个图文混排的例子,然后是一个只有图片的list例子跟一个水平菜单的例子,最后是一个以放大数字开头的列表.对于初学者而言这里可以学到很多东西,对于熟手,直接拿来用就是了. 1.helvetica字体的列表 第一个例子的样式看起平淡无奇,不过喜欢简约风格的人也许会感兴趣,这类似于印刷字体风格

网页教学网推荐:常用网页设计效果代码十五例

设计|网页|网页设计 1.忽视右键 <body oncontextmenu="return false"> 或 <body style="overflow-y:hidden"> 2.加入背景音乐 IE:<bgsound src="*.mid" loop=infinite> NS:<embed src="*.mid" autostart=true hidden=true loop=tru

网页教学网推荐:Flash常用代码的介绍

网页 1.用flash 做那种弹出的小窗口 分两步: 给flash中的按钮加入如下action: on (release) { getURL ("BLOCKED SCRIPTMM_openBrWindow('newweb.htm','','width=600,height=100')"); } 在HTML页面的...之间加入下面的javascript代码. 2.如何使得flash一打开就是全屏? fscommand("fullscreen",true) 如何不能使用

建站教学网收集一百多个常用js代码

1.文本框焦点问题 onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 Onchange:当文字值改变时,产生该事件 Onselect:当文字加亮后,产生该文件 <input type="text" value="郭强" onfocus="if(value=='郭强') {value=''}" onblur="if (value=='') {value='郭强'}">点击时文字消

响应式网页设计:很全的响应式网页设计教程

文章描述:响应式网页设计考虑到多平台.多种屏幕尺寸的情况,能够优化多种设备的网络浏览体验. 响应式设计现在已经成为网页设计师学习的焦点.网页教学网发现群内有很多相关的讨论了,这说明我们平时接触该类案例越来越多.你会渐渐发现,我们身边越来越多的企业和客户关注到响应式网站,作为勤奋的设计师,我们怎么能不对它进行了解呢? 响应式网页设计考虑到多平台.多种屏幕尺寸的情况,能够优化多种设备的网络浏览体验.当你不知道用户使用什么设备,不知道用户的屏幕尺寸时,若想达到较优布局,可以采用响应式设计.在进行响应式

初学网页制作:CSS特点及加入网页的四种方法

css|初学|网页 今天给初学者介绍一下CSS特点及如何在网页中使用已经设置的CSS.希望大家支持网页教学网,网站有什么问题及时与我联系! CSS(Cascading Stylesheets,层叠样式表)是一种制作网页的新技术,现在已经为大多数的浏览器所支持,成为网页设计必不可少的工具之一.使用CSS能够简化网页的格式代码,加快下载显示的速度,也减少了需要上传的代码数量,大大减少了重复劳动的工作量.尤其是当你面对的是有数百个网页的站点时,CSS简直象是神对我们的恩赐! 前言 CSS(Cascad

网页标准研究:用CSS实现网页中鼠标交互的方法

css|标准|交互|鼠标|网页 我们浏览网页的时候,经常会遇到一些交互的效果.例如容器在鼠标移上去的时候,会发生一些变化.这些效果,可以用多种方法来实现.现在我们要解决的是如何在CSS中写脚本实现交互效果. CSS代码如下: .show {width:600px;height:58px;margin:50px auto 0 auto;line-height:58px;border:1px solid #c00;background:#f0f0f0;text-align:center;/*webj

Webjx收集整理最新20个Photoshop网页设计教程

在你打开一个网站的时候,首先注意到的当然是它的设计,第一印象至关重要,网站的设计将帮助访问者决定是否继续浏览该网站.今天,本文收集了最新20个 Photoshop 网页设计教程,帮助你设计出更精美的网页. How to create a colorful business web layout Create a consulting web layout Create a movie video streaming website Create a gritty portfolio layout