title: Auto generate CSS classes from HTML elements style attribute
body: <p>I was wondering if there's an online software or a script that could auto-generate CSS classes from HTML elements style attribute? Something like checking all style attributes and generate a CSS style sheet from what has been found.</p>
  
  <p>I would like to have something like this:</p>
  
  <pre><code>&lt;!-- &lt;div style="margin-top:10px; width:200px; height:100px; 
  background:#ddd; border:4px solid #09f;"&gt;&lt;/div&gt; --&gt;
  &lt;div class="s1 s2 s3"&gt;&lt;/div&gt;
  
  &lt;!-- &lt;div style="margin-top:10px; width:180px; height:100px; 
  background:#ddd; border:4px dotted #f00;"&gt;&lt;/div&gt; --&gt;
  &lt;div class="s2 s4 s5"&gt;&lt;/div&gt;
  
  &lt;!-- &lt;div style="margin-top:20px; width:20px; height:20px; 
  border-radius:50%; background:#444;"&gt;&lt;/div&gt; --&gt;
  &lt;div class="s6 s7 s8"&gt;&lt;/div&gt;
  
  &lt;!-- &lt;div style="margin-top:10px; width:20px; height:20px; 
  border-radius:50%; background:#3b3;"&gt;&lt;/div&gt; --&gt;
  &lt;div class="s0 s7 s9"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>JSFiddle :</p>
  
  <p><a href="http://jsfiddle.net/pmrotule/osLuad7a/4/" rel="nofollow"><strong>BEFORE</strong></a></p>
  
  <p><a href="http://jsfiddle.net/pmrotule/osLuad7a/2/" rel="nofollow"><strong>AFTER</strong> (with the style sheet)</a></p>
  
  <hr>
  
  <p>I know that you can get the style array like this:</p>
  
  <pre><code>console.log(document.getElementById('yourElement').style);
  </code></pre>
  
  <p>But how do you compare it with other elements?</p>