解决CSS问题的步骤 [英] Steps to troubleshoot CSS problems

问题描述

我遇到了一个相当小的CSS问题，因此对我的网站特别是，对其进行谷歌搜索不会返回任何有用的信息. (我不妨用google为什么我的CSS不能正常工作?"之类的问题来描述就容易了.)

I've got a rather minor CSS problem, so particular to my site that googling for it doesn't return anything useful. (I might as well google "why isn't my CSS working?" for as easy to describe as the problem is.)

到目前为止，我已经想到了几种方法来解决该问题，

I've thought of a couple ways to troubleshoot the issue so far, including:

• CSS和HTML验证器和短毛绒
• 在Firebug中闲逛数小时
• 在IDE中粘贴代码以确保括号，[]和{}匹配
• 查看旧代码(其中一些起作用)与新代码(其中不同部分起作用)之间的差异，以发现潜在的错误
• 使用IDE拼写检查器查找拼写错误(当Javascript与CSS和HTML混合使用时可能会很困难)
• 搜索

• CSS and HTML validators and linters
• tweaking around in Firebug for hours
• pasting code in an IDE to make sure parens, []'s and {}'s match
• looking at diffs of old code (some of which worked) with newer code (different parts of which worked) to find potential errors
• using the IDE spellchecker to look for typoes (can be tough when Javascript mixes with CSS and HTML)
• googling

我还应该尝试其他故障排除技术吗?

Are there any other troubleshooting techniques I should be trying?

(具体问题是以前正确呈现的@font-face不再正确呈现.)

(The specific problem is that an @font-face that was previously rendering correctly is no longer rendering correctly.)

推荐答案

我会做这样的事情.

首先在Firebug(或其他浏览器中遇到问题的其他方法)中闲逛.对我来说非常重要的事实是，您可以看到，实际上使用了哪个CSS声明，然后可以将其打开和关闭.

At first dabbling around in Firebug (or the other methods in the other browser when they have the issue). Very important to me is the fact, that you can see, which css declaration is really used and then can switch it on and off.

如果这没有成功，您可以尝试在页面外部重新创建问题.尝试例如将一些代码复制到jsfiddle中，然后删除代码，直到错误消失为止.或相反:从头开始构建代码，直到出现错误为止.

If this leads to no succecss, you could try to recreate the issue outside of your page. Try e.g. to copy some of the code into jsfiddle and then delete code until the error disappers. Or the other way round: build you code from the ground up until the error occurs.

接下来要做的是研究.是浏览器中的错误，代码不正确还是浏览器不支持该声明

What you have to do next is research. Is it a bug in a browser, is your code not correct or is the declaration unsupported in your browser

如果使用了外部资源，请尝试在浏览器中使用网络检查器查看是否已加载资源，然后再加载确切的资源以查看其内容

If external resources are used, try the network inspectors in your browser to see, if the resources are loaded and then load the exact resource to see, what the content of this is

这篇关于解决CSS问题的步骤的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！