: Tool to view currently used CSS definitions Possible Duplicate: Refactoring large/old CSS files Wondering if anyone knows of a product that would help you to "see" all the css styles
Possible Duplicate:
Refactoring large/old CSS files
Wondering if anyone knows of a product that would help you to "see" all the css styles currently defined on a page.
For example... Say I'm working on a page and want to create a "leader" css value as a class for a span to make wrap around the first few words of a paragraph to make them bold.
I could do something like...
.leader { font-weight:bold; }
and then...
<p><span class="leader">Four score and seven years ago</span> our Fathers...</p>
I may create this w/out realizing a class called "leadertext" was already defined in a stylesheet on the page. Without either having knowledge of it, or scanning through all the CSS I have I don't know of a way to know what's already set.
Curious if there's some silver bullet I don't know about.
More posts by @Mendez628
2 Comments
Sorted by latest first Latest Oldest Best
Automatic CSS documentation tools such as KSS and css_doc will examine a stylesheet and produce documentation for it that you can use as a styleguide to avoid recreating existing styles.
KSS, for example, takes a stylesheet formatted to a certain convention and produces a "living styleguide" that looks like this:
The concept is very much like phpDocumentor for PHP and Rdoc for Ruby, but for CSS instead.
The downside is that your stylesheet has to have been formatted using KSS comment conventions, so it won't help for regular stylesheets. Still, it's worth knowing about for future projects, especially if you're collaborating with a team.
Use Firebug, look at the html tab and there you will have css rules for current markup element, here is a screenshot :
Terms of Use Create Support ticket Your support tickets Stock Market News! © vmapp.org2024 All Rights reserved.