当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > 网页版Firebug

CSS样式表
IE和Firefox浏览器CSS网页布局不同点
CSS改变选择网页文字背景色
CSS3教程(1):什么是CSS3
浏览器Apple Safari和Google Chrome内核webkit
YaHoo方法:CSS Reset重设浏览器的样式
你知道吗?CSS样式表也能挂网页木马
通过宜家的家具设计方法学习CSS模块化
可读性CSS代码编写的小技巧
建议网页开发者使用IE8测试版测试网站
帮我写出更好的CSS代码的一些技巧
CSS初学福音:解决你对英文单词的不理解
两个CSS代码精简工具(网页推荐)
IE6图片元素img下出现多余空白的问题
将设计稿转换成WEB页面职业者
W3C标准以及XHTML和HTML
网页字体该如何设置?
学CSS网页布局排查错误的方法
CSS常见的让元素水平居中显示的方法
CSS网页布局教程:CSS伪类定义3种方法
CSS模块化思想的优势

CSS样式表 中的 网页版Firebug


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-09   浏览: 108 ::
收藏到网摘: n/a

Firebug 可以说是 FF 最强大的插件之一,它不但可以查看 xhtml 代码、CSS 代码、JS 代码、DOM 结构,还可以临时修改这些代码,是开发不可缺少的利器。这也许您早已知道,但网页版的 "Firebug" 你听说吗?其实也不是 Firebug 了,而是类似于 Firebug ,功能也没有真正的 Firebug 那么强大,仅可以用来查看网页 DOM 结构和一些 CSS 样式。虽然功能不多,但在某些情况下、某些时候已经够了,特别值得一提的是:它可以在多种浏览器:IE 、FF 、Chrome 中正常运行,除了 Opera ,所以在某些时候还是用的上滴。看看效果吧:

网页版Firebug

那这东西在哪呢?下面的代码就是了:

javascript:function%20loadScript(scriptURL)%20{
%20var%20scriptElem%20=%20document.createElement('SCRIPT');
%20scriptElem.setAttribute('language',%20'JavaScript');
%20scriptElem.setAttribute('src',%20scriptURL);
%20document.body.appendChild(scriptElem);}
loadScript('http://westciv.com/xray/thexray.js');

用法:

1、复制上面的代码(并把它改成一行,我把它换行是为了防止代码过长而自动隐藏了);

2、打开个网页,等它加载完;

3、在地址栏粘贴刚才复制的代码;

4、出来一个黑框框了吧,OK,可以用了,用鼠标点击某个地方,就能显示DOM 结构和一些 CSS 样式。