Menu
Just curious does anyone know a program or script to generate a style sheet(with blank values obviously) from the structure of your html document? Basically just pull out the ID's and Classes you set in your html and make placeholder css so you don't have to plan it ahead of time or write it again ,remember D.R.Y. anyone?:) Feel free to yell at me if you don't think this could help anyone else here :D . I'm sure I could whip something up like that but if it's already out there I might as well stick to my rule of DRABEE(Don't repeat any body else either) . Thanks.
564
asked Feb 07 '11 10:02
Install "eXtract Snippet"=> Inspect an element using chrome's developer tools 'inspect element'. Within the developer tools you should also see a panel named "eXtract HTML CSS". Click on to the "eXtract HTML CSS" panel and further click onto the "Get HTML/CSS of inspected element" button withing the panel.
Creating a CSS Class Using a Class SelectorAfter adding the code snippet to your styles. css file, save the file. In this code snippet you have added text using the HTML <p> tag. But you have also specified the red-text class by adding the highlighted class attribute class="red-text" inside the opening HTML tag.
If you're using the Chrome inspector (right click page, inspect element), highlight the line and look to the right. It should show the CSS class and any rules that are used, and a link to the CSS file.
Did you check http://primercss.com/ ? Seems to be doing exactly what you are asking for.
50
CSS Frame Generator http://lab.xms.pl/css-generator/ works better than Primer.
28
Little late to the party but these days, there is also BearCSS:
http://www.bearcss.com/
Disclaimer
This answer is primarily meant to add extra value to this thread and create an overview of CSS generators.
In my opinion, after trying all the mentioned tools in this thread, http://lab.xms.pl/css-generator/ is the best one.
43
I found the best tools out there, after rigorous comparisons of the different available ones:
If you want to generate CSS automatically from the markup online for free, then you need BeeCSS - CSS Generator:
http://beecss.theextremewebdesigns.com/
If you already have (messy) CSS & you would like to clean/minify it online for free, then you need BeeCSS - Cleaner Minifier
http://beecss.theextremewebdesigns.com/css_clean_css_minify/
40
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
