easiest way to find missing css classes and ids

How can I identify css classes or ids that are referenced in code but missing in the css file? Is there any feature in firebug that i can use?

Thanks.


Firebug does not do this, nor any tool I can think of, because it is not a common or high-payback task.

However, it is a common task to find unused CSS rules, so that they can be trimmed. You can get a performance gain by trimming common CSS files. But removing ID's and classes from HTML pages does not help as much, and is more likely to break something (see below).

A good/common Firefox add-on for finding unused CSS rules, is Dust-Me Selectors. If you really want a tool to find ID's and classes that don't have CSS rules, you could probably take that add-on's source code as a good starting point for making your own Firefox extension.


Removing ID's and classes, just because they don't have a CSS rule is not a good idea and could break things.
ID's and classes can be in a page for a variety of reasons, not just as convenient handles for CSS.

Here are some reasons why an ID or class might be in a page:

  • To identify content to javascript, or mark targets for changing content. This is a must for all but the simplest dynamic pages.
  • Likewise, Id's and classes are used by plugins, extensions, spiders, RSS tools, etc.
  • As state or status indicators. EG: <p class="comment highest-rated">...
  • As easy substitutes for in-page anchors. These allow precisely-targeted hyperlinks without adding elements. Example link.
  • As part of good Semantic Markup, which is a best-practice that helps humans and our scripts understand, use, and maintain pages.
  • To help with targeting CSS.

  • Visual Studio, with the ReSharper plugin does this. It shows each missing class with a blue waved underline.

    I am not sure which versions of what, but I use

  • Visual Studio 2013 Premium
  • ReSharper Version 8.2.3
  • Other versions might do as well.

    链接地址: http://www.djcxy.com/p/68664.html

    上一篇: 帮助Hibernate集合外键映射

    下一篇: 最简单的方法来找到缺少的CSS类和ID