CodingWebsite/Page/Style Ripping

 

Press Ctrl+Enter to quickly submit your post
Quick Reply  
 
 
  
 From:  af (CAER)  
 To:  ANT_THOMAS      
40015.6 In reply to 40015.1 
The problem there is that a lot of websites will use minified stylesheets, or a stylesheet generated during deployment that is a combination of several smaller ones (particularly if they use SASS or LESS). That makes the resultant CSS file not particularly friendly to human readers, and somewhat difficult to pick apart.

Furthermore, a lot of designs are going to be dependent on a specific HTML structure, so even ripping the entire CSS file won't work when you apply it to your site.

You'd be better off using Chrome's Web Inspector, or Firebug, or Opera Dragonfly, and looking at how the site has achieved a particular effect/result. The Chrome WI Computed Style thing is pretty handy for this, and the Styles bit below that will list all the rules that apply to the selected element (with overridden ones crossed out).
caerphoto_sig.png
0/0
 Reply   Quote More 

 From:  ANT_THOMAS   
 To:  af (CAER)     
40015.7 In reply to 40015.6 
I'll give that idea a go.

I'm not so much wanting to apply their styles to my site, more a case of doing it the other way round and taking their design and layout and making changes to that. 

I basically want to be able to take a page and make a template of some sort out of it.
0/0
 Reply   Quote More 

 From:  ANT_THOMAS   
 To:  ALL
40015.8 
Managed to strip it back and get pretty much what I want out of the page.

Next question, the CSS file has all the styles on a single line with no line breaks (fail)

Is there any software or site that will auto-format a CSS file?
0/0
 Reply   Quote More 

 From:  ANT_THOMAS   
 To:  ANT_THOMAS      
40015.9 In reply to 40015.8 
Google it first.... http://www.cleancss.com/
0/0
 Reply   Quote More 

 From:  CHYRON (DSMITHHFX)  
 To:  ANT_THOMAS      
40015.10 In reply to 40015.8 
search & replace with regular expressions

----
"neural networks that run on 16,000 processors simultaneously, enough power that they could learn to recognize cats just by watching YouTube "
0/0
 Reply   Quote More 

 From:  af (CAER)  
 To:  ANT_THOMAS      
40015.11 In reply to 40015.8 
Chrome's Sources tab in the Web Inspector has a { } button at the bottom that formats source files nicely - works for JS, CSS and HTML.
caerphoto_sig.png
0/0
 Reply   Quote More 

Reply to All    
 

1–11

Rate my interest:

Adjust text size : Smaller 10 Larger

Beehive Forum 1.5.2 |  FAQ |  Docs |  Support |  Donate! ©2002 - 2024 Project Beehive Forum

Forum Stats