本文目录
浏览器开发者工具怎么修改本地网页
1/7 分步阅读开发者工具的开启方法：打开任意一款浏览器，点击“工具”菜单项，从弹出的下拉菜单中点击“开发者工具”即可打开。2/7利用开发者工具来修改网页内容：在开发者工具界面中，点击左侧的“搜索”按钮，该按钮用于选择网页中的一个元素。3/7该选择工具具有网页元素自动识别功能，可以自行定位并找到最小的元素，如图所示，小编选择其中一个连接文字 并点击。4/7点击对应的文字链接后，在开发者工具界面中会自动定位到相应的HTML代码处。5/7如何修改当前行代码呢？右击当前行，从弹出的右键菜单中选择“Edit As HTML”项，即以HTML形式进行。6/7此时将出现窗口，这样我们就可以对当前代码行进行操作啦，如图，小编将“贴吧”修改成“百度经验”。7/7最后查看网页内容，就会发现网页内容被改变啦。
什么是浏览器开发者工具
简单说，浏览器开发者工具就是给专业的web应用和网站开发人员使用的工具。作用在于，帮助开发人员对网页进行布局，比如HTML+CSS，帮助前端工程师更好的调试脚本（JavaScript、jQuery）之类的，还可以使用工具查看网页加载过程，获取网页请求等。一般在windows系统上浏览器开发者工具打开都是按F12快捷键。
参考资料来源:浏览器开发者工具基本使用教程
各位web开发员平时都用到什么辅助工具
开发一个优秀的网站并非易事，一个面面俱到并且美观的网站，即使对于经验丰富的Web开发者而言也是项艰巨的任务。在那之前您必须认识到当前的趋势及标准，并确定如何将这些都纳入您的设计之中。幸运的是，现在有很多免费的工具可供使用，以帮助您提高效率，使得工作更有效率。以下这20个实用WEB辅助开发设计工具对于开发者而言无疑都会从中受益。TypetesterTypetester是在线比较不同的文字和文字属性在给定的文本里显示效果的应用。其主要作用是使网页设计师的生活更轻松，快速方便的比较不同的字体视觉。pForm使用这款免费易用的工具在几秒钟内创建php表单。如果你需要更多的功能，你可以注意他的父项目MachForm或者更棒的替代品wufoo和formspring（这两个版本提供有限的免费和付费高级版）。ColourLovers为色彩爱好者而建立的国际型站点。你能搜索网站的调色板，使用在项目上或者创建新的可被评价的调色板。对灵感或者设计理念的批判很有好。FirebugFirebug 与Firefox集成，将大量丰富的网页开发工具引到你指边。浏览的时候，你就可以实时在任何的网页上进行，调试，和检测css，html和JavaScript。这可能是一个最为广泛使用的Web开发工具了。如果你没有他，立刻去下一个去。HTML Entity Character Lookup假如你需要知道如何在你的网页上显示商标符号，那么这款工具恰恰可以帮助你。HTML实体查询搜索HTML实体匹配的搜索特性建立在字符看起来怎样 的基础上的，例如，字母“ C ”将匹配©和¢实体，因为他们看起来差不多。这确实是你需要尝试了解他是怎样有用的工具。（MAC用户也可以作为仪表板部件使用）。960 Grid System960网格系统是为了简化Web开发流程，提供常用尺寸，基于宽度960px。这里两个变种，12和16列，可单独使用也可以协作使用。全面赏析此框架Em CalculatorEm Calculator是一个小JavaScript工具，它可以让您输入一个像素大小并显示相应的EM值。这个工具非常易于使用和便捷的快速参考。Browser Shots您可以在约100名不同的浏览器的4个不同的平台中查看您网站，以确定最终的跨浏览器的支持。鉴于目前存在的许多不同类型的配置，重要的是要确保您的网站看起来更好，更可能的支持更多的平台。Icon FinderIconfinder为Web设计者和开发者运用简单有效的方式提供高质量的图标。你只需要在搜索框中键入一个关键字，Iconfinder将会给你带来美丽的图标，你可以自由的使用。WhatTheFont假如你想之你最喜欢的blog使用的什么字体，这个工具能帮到你。仅需要上传一张字体的图片，此工具就可以尽可能的匹配正确的字体。如果你宁可相信一个真正的人，WhatTheFont论坛的资源是一个很好选择。MeasureIt很棒的Firefox插件，绘出一把尺子获得任何内容网页上像素的宽度和高度。ColorZilla你可以使用ColorZilla获取浏览器上任何一点的颜色。快速校对颜色粘帖到另一个程序中，你可以放大你正在查看的网页大小，测量网页上任意两点间的距离。PingdomPingdom加载完整的HTML网页，包括所有的对象（图像，CSS，JavaScripts，rss，Flash和帧/框架） 。它模仿是在页面在Web浏览器中加载的方式，然后使用很不错的视觉时间条显示每个元素的家寨时间。这可能对尝试调高网闸你的效率十分的有用。Test Everything大体的测试网站所有东西。100个不同的校验器和测试，所有都舒适的在一个应用程序中。节省网站开发测试阶段的大量的时间。CSS Sprite GeneratorSprites可以通过减少HTTP请求数提高网站速度，因此变得越来越受欢迎。使用他们，需要更大的远见和规划，从而增加了使用他们的难度。这个 令人惊奇的工具允许上传图片压缩包，然后将它们合并为一个sprite，一旦sprite被创建，它会创建一份你需要使用sprite的CSS，免费完整 下载使用。Web Developer Toolbar一个非常有的Firefox插件，提供了很多web开发人员日常基础工具，快速验证XHTML或检查HTTP头信息。Domainr有很多工具可以告诉你某个域名是不是注册了。Domainr除了帮助查询你需要的，而且还尝试建立更值得使用的名字。Domainr帮助您探测整个 域名空间，超出了无处不在的和拥挤的.com, .net 与.org的限制。借助jish.nu，burri.to和del.icio.us的灵感，当你想不到独特的域名的时候这个工具就可以派上了用场了。Font BurnerFont Burner是免费在线工具，可以搜多超过1000种字体。一旦你找到喜欢的字体，该工具会提供一小段代码，让你在自己的网站上免费使用字体。不论用户是否安装此字体,字体都将在每部电脑上显示。如果你想知道自己到底喜欢哪款字体，请参考：史上最漂亮的100种字体Smush.ItSmush.It是一个简洁的非失真图像优化应用工具，帮助你压缩图片。
网站开发工具有哪些
你写网页是用什么软件呢？Dreamweaver？FrontPage？ UltraEdit 还是记事本？其实除了这类编写 HTML 和程序码的软件以外，还有很多小巧而且免费的软件，可以帮助你在写网页时更方便、写的更好哦！尤其时在写 CSS、Javascript 或 Ajax 的时候，这些都是不可或缺的软件呢！也是小正正平常工作在使用的软件，现在要介绍给你！综合开发工具综合的网站开发工具几乎都是浏览器的插件，提供了许许多多的功能，例如：开关 CSS、开关 Javascript、开关 Cache：可以马上看到你的网页在浏览器中没有 CSS、没有 Javascript 或没有快取时的是长怎么样子。为什么要看没有 CSS 和 Javascript 的状况呢？一切都是为了 Accessibility 啊！检视页面中文件的 DOM 结构和指定范围的原始码。检视每个元素或 DIV 的ID、Class、目前的CSS样式（包括继承的样式），也可以将元素或 DIV 的外框显示出来。对于找出 CSS 和 Javascript 的问题十分有用。检验 HTML 和 CSS 语法是否正确、符合 W3C 的标准。因为这些工具是属于浏览器的插件，所以有分为给 IE 和 Firefox (缩写为FF) 所使用的版本，包括有：Internet Explorer Developer Toolbar (IE)Web Developer Extension (FF)Firebug (FF)HTTP 呼叫检视工具让你可以很容易看到任何由浏览器所发出的 HTTP Request 的一切细节，包括档头资讯、所传递的参数、档案大小、传输速度和时间…等等。用来观察 Ajax 呼叫的行为和除错最方便了！HttpWatch (IE)Firebug (FF)原始码工具其实大部分的综合开发工具就已经有这样的提供功能，让你单独检视网页中某个区域的原始码，或是帮你检查语法的正确性，另外也有单独小巧的原始码相关工具可以使用。想要鼠标滑过去就立刻看到该范围的原始码吗？而不需要在茫茫“码“海中捞针。Instant Source (IE, 不是免费的)HTML VALIDATOR (FF)图形相关工具除了用 Photoshop、Fireworks 这类标准的大型软件来切图以外，对于平常一些简单的工作，杀机焉用牛刀呢？Color Cop：可以吸取画面上任何地方的颜色色码。MeasureIt (FF)：测量画面上的像素距离，例如想知道行距、边界要设为多少像素时，就靠他了。Screen Calipers：这是另一套用来测量画面上像素距离的小软件。Split Browser (FF)：将 Firefox 同一个浏览器视窗分为上下或左右两半，让你可以在同一个画面上同时看到两个或多个不同的网页内容，互相做比对，而不需要在多个视窗中切换来切换去。IE Tab (FF)：虽然是叫做 IE Tab，但这可是 Firefox 的插件。让你在 Firefox 的浏览器视窗中开启 IE，神奇吧！MWSnap：免费的萤幕抓图软件，用来切图也很方便，只要用秀图软件将原始网页设计的整张图打开、显示在萤幕上，就可以用萤幕抓图软件，撷取出某个范围的图形了。HyperSnap：另一套好用的萤幕抓图软件，但不是免费的。Picasa：Google 的免费秀图、图片管理软件。Adobe Labs’ Kuler：Adobe 提供配色参考的网站，想不出要用什么颜色时，不妨去看一看找寻灵感吧！
哪个手机浏览器有开发者工具
手机safari浏览器有开发者工具。
Safari是一款由苹果开发的网页浏览器，是各类苹果设备（如Mac、iPhone、iPad、iPod Touch）的默认浏览器。Safari使用WebKit浏览器引擎。
Safari，作为苹果计算机的操作系统macOS中的浏览器，它用来取代之前的Internet Explorer for Mac。Safari以惊人速度渲染网页。与Mac及iPod touch、iPhone、iPad兼容。让最爱网站一目了然。聪明的它还会检查拼写和语法。
简介
手机浏览器是运行在手机上的浏览器，可以通过GPRS进行上网浏览互联网内容，用户通过地址栏向万维网服务器发送各种请求，并对从服务器发来的超文本信息和各种多媒体数据格式进行解析、渲染和显示。
手机浏览器是一种用户在手机终端上通过无线通讯网络进行互联网内容浏览的移动互联网工具，其最主要的应用为网页浏览，同时也可以聚集大量的应用，如导航、社区、多媒体影音、天气、股市等，为用户提供全方位的移动互联网服务。
网站开发过程中常用的工具有哪些
制作网页的基本软件离不开HTML，但是如果真的要用其完成全部的网络课程开发是不现实的，因为既不方便效率又低，常用的方法是选择一种工具软件，只是在必要的时候对工具软件生成的HTML文件进行，这样可以使开发工作变得简单又轻松。但网页制作工具只是对其中各种类型的媒体进行了集成，媒体的还需要各种类型的媒体工具软件。一． Microsoft公司的FrontPage应用开发工具可大大提高编制网络课件的效率. 目前,国际上比较流行的Web页制作软件大致可以分为两类:代码型和所见即所得型.代码型的制作软件要编程,对于初学者来说想要立即上手比较困难. Microsoft公司的FrontPage就不同了,它作为一种所见即所得型的代表软件,可以使使用者的工作效率得以很大提高. FrontPage 2000 是Office 2000 家族的一员,沿袭着Office 的风格.所以会用 Word 的人很容易学会FrontPage.二． Macromedia 公司的DreamweaverDreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页器，它是第一套针对专业网页设计师特别发展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页.Dreamweaver的特点· 可视化的专业网页器· 友好的工作界面· 网站管理功能· 强大的多媒体处理功能· 提供行为等控件来进行动画处理和产生交互式响应· 和Macromedia公司其他软件(Fireworks, Flash)的完美协作Dreamweaver可以很好地控制HTML原代码,而不会产生垃圾代码. Dreamweaver有一个很神奇的工具-层.层的嵌套、层的可见性、层的重叠,与时间线相配合可以作出许多动态效果,使网页变得多姿多彩,生动活泼.行为Behaviors是Dreamweaver中很有特色的功能,在网页中使用可以产生互动的效果,增强网页的交互性.如Dreamweaver中有一个行为叫 Drag layer (拖动层),用它可以设计出拼图游戏等.将标准答案拖到正确的位置上.与JavaScript调用结合在一起实现一定的功能,如弹出一个窗口,判断对与错.用Dreamweaver的扩展程序CourseBulider，可以很方便地创建交互式课件。如选择题、填空题、拖放题、计时器等。利用Dreamweaver的模板功能、重复部件库可以大大提高网络课件的制作效率。Flash和Fireworks都实现了与Dreamweaver的无缝集成,可以在Dreamweaver中方便地插入Flash动画和Fireworks生成的图像.最新版本Macromedia Dreamweaver MX，更好支持对Web 站点、Web 页和 Web 应用程序进行设计、编码和开发。无论您喜欢直接编写 HTML 代码的驾驭感还是偏爱在可视化环境中工作，Dreamweaver MX都会为您提供帮助良多的工具，丰富您的 Web 创作体验。利用 Dreamweaver MX中的可视化功能，您可以快速地创建页面而无需编写任何代码。不过，如果您更喜欢用手工直接编码，Dreamweaver MX还包括许多与编码相关的工具和功能。并且，借助 Dreamweaver MX，您还可以使用服务器语言（例如 ASP、ASP.NET、ColdFusion 标记语言 (CFML)、JSP 和 PHP）生成支持动态数据库的 Web 应用程序。您可以查看所有站点元素或资源并将它们从易于使用的面板直接拖到文档中。您可以在 Macromedia Fireworks 中创建和图像，然后将它们直接导入 Dreamweaver，或者直接在 Dreamweaver 中添加 Macromedia Flash 对象，从而优化您的开发工作流程。Dreamweaver MX还包括多种与编码相关的工具和功能，其中包括代码视图中的代码工具（如代码加色和标签完成）；有关 HTML、CSS、JavaScript、CFML、ASP 和 JSP 的参考资料以及一个 JavaScript 调试器。Macromedia MX的可自由导入导出 HTML 技术可导入您手工编码的 HTML 文档而不会重新设置代码的格式，您可以随后用您首选的格式设置样式来重新设置代码的格式。Dreamweaver MX现在包含并扩展了 Macromedia UltraDev 中的所有功能，以帮助您使用 ASP、ASP.Net、ColdFusion 标记语言 (CFML)、JSP 和 PHP 等服务器语言来生成由动态数据库支持的 Web 应用程序。Dreamweaver MX可以完全自定义。您可以创建您自己的对象和命令，修改键盘快捷方式，甚至编写 JavaScript 代码，用新的行为、属性检查器和站点报告来扩展Dreamweaver 的功能。三．网页制作工具的综合运用Microsoft公司的FrontPage 和Macromedia公司的Dreamweaver是使用最多的HTML网页制作工具。它们都支持多种媒体类型，可以通过ActiveX定义接口，与脚本编程语言JavaScript和VBScript配合，创建动态交互的Web教学系统。特别值得指出的是，Macromedia的Dreamweaver以及Flash和Fireworks一起被人们称作网页制作三剑客，三者的有机结合，可以说是目前使用方便、功能强大的网站管理及HTML页面制作工具。可以用Macromedia的Fireworks设计图形并使网页图形最优化。Fireworks使用一整套的位图及矢量工具来创建、并且动态生成网络图形，并可以输出到Dreamweaver及其他的HTML代码软件中。通过在Dreamweaver或Flash中直接对Fireworks进行调用、图形来实现流畅的工作流程。Macromedia的Flash是制作动画及矢量图形的工具软件。用它制作的动画是窄带动画，适合于网络传输的Web界面，许多在线观众都是通过Flash Player观看用Flash 制作的内容。四．Java开发工具应选择可移植性好的开发工具。如JDK。虽然Java程序的可移植性好，但其也依赖于使用的开发工具，如果使用了一些编程工具自己提供的扩展功能，则可能会降低可移植性。五．数据库的选择最好选择能跨平台使用的数据库，如Oracle等。
