SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Zealot
    Join Date
    Mar 2002
    Location
    Vancouver, USA
    Posts
    143
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Embeded/Inline CSS to External?

    Is there an application or script that can read an HTML file and extract any inline or embeded CSS to an external file?

  2. #2
    Team SitePoint AlexW's Avatar
    Join Date
    Apr 2000
    Location
    Melbourne
    Posts
    832
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Not that I know of. HTML tidy will take font tags out and rationalize them to CSS definitions in the head, but rationalizing inline CSS.... don't think so.
    Alex Walker
    SitePoint Developer
    SitePoint - Learnable

  3. #3
    SitePoint Zealot
    Join Date
    Mar 2002
    Location
    Vancouver, USA
    Posts
    143
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, I just need that idea to my growing list of ideas when I get around to it, sometime around 2025 probably

  4. #4
    Team SitePoint AlexW's Avatar
    Join Date
    Apr 2000
    Location
    Melbourne
    Posts
    832
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Would something like 'Replace in Files' http://www.emurasoft.com/de/replall/ do the trick? Search for the inline style and replace it with a class.
    Alex Walker
    SitePoint Developer
    SitePoint - Learnable

  5. #5
    SitePoint Zealot
    Join Date
    Mar 2002
    Location
    Vancouver, USA
    Posts
    143
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Not really, I need to get the style info out of the HTML and into a .css file, not just prep the HTML file for the CSS usage.

  6. #6
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm not clear about what you need.

    Do you mean something that can strip out embedded and inline css dynamically and create an external css file 'on the fly' as the page is being read in by the browser? (and presumably write in the @import markup too)
    (The above software link didn't make it any clearer to me as my German ist nicht so gut und ich habe kein PC.)
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  7. #7
    SitePoint Zealot
    Join Date
    Mar 2002
    Location
    Vancouver, USA
    Posts
    143
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    basically, I want to take an HTML file that looks like :
    Code:
    <html>
    <head>
    <title>index.gif</title>
    <meta http-equiv="Content-Type" content="text/html;iso-8859-1">
    <meta name="description" content="FW MX CSS Layer">
    <style>
    body{ background: url(images/back.gif) repeat-x; }
    </style>
    </head>
    <body bgcolor="#ffffff">
    <div id="indexr1c1" style="position:absolute; left:0px; top:4px;width:345px; height:76px;z-index:1; visibility:visible"><img name="index_r1_c1" src="images/index_r1_c1.gif" width="345" height="76" border="0"></div>
    <div id="indexr1c7" style="position:absolute; left:515px; top:4px;width:265px; height:75px;z-index:2; visibility:visible"><img name="index_r1_c7" src="images/index_r1_c7.gif" width="265" height="75" border="0"></div>
    <div id="indexr2c10" style="position:absolute; left:650px; top:83px;width:130px; height:49px;z-index:3; visibility:visible"><img name="index_r2_c10" src="images/index_r2_c10.gif" width="130" height="49" border="0"></div>
    <div id="indexr6c1" style="position:absolute; left:0px; top:448px;width:190px; height:151px;z-index:4; visibility:visible"><img name="index_r6_c1" src="images/index_r6_c1.gif" width="190" height="151" border="0"></div>
    <div id="indexr6c3" style="position:absolute; left:196px; top:448px;width:190px; height:151px;z-index:5; visibility:visible"><img name="index_r6_c3" src="images/index_r6_c3.gif" width="190" height="151" border="0"></div>
    <div id="indexr6c6" style="position:absolute; left:393px; top:448px;width:190px; height:151px;z-index:6; visibility:visible"><img name="index_r6_c6" src="images/index_r6_c6.gif" width="190" height="151" border="0"></div>
    <div id="indexr6c9" style="position:absolute; left:590px; top:448px;width:190px; height:151px;z-index:7; visibility:visible"><img name="index_r6_c9" src="images/index_r6_c9.gif" width="190" height="151" border="0"></div>
    </body>
    </html>
    And get all the CSS stuff out of it and in to an external file.

    I can Psuedo code what would need to happen, and could probably write a PHP script that would do it, but it would be nice to have a compiled EXE application that can do it.

  8. #8
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I understand that bit.
    The question I'm asking is do you want this action to be done 'live' on the web or is it something you want to do on your computer before you upload the files to your webspace?
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  9. #9
    SitePoint Zealot
    Join Date
    Mar 2002
    Location
    Vancouver, USA
    Posts
    143
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The edited post may make it clearer. I want it done on my system for further editing. I do my initial page layout work in Fireworks, and as you can see from the code there, I export the sliced page as CSS Layers in Fireworks, but I prefer to work from an external style sheet, because, well that's where CSS is most powerful

  10. #10
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    On the off-chance that you have access to Dreamweaver (and not just Fireworks) there is an extension called 'create css files from style tags'.

    You should be able to find it via Google or at the Macromedia DW extension exchange.

    If you don't have DW, then it's possibly time to get it as Fireworks alone is not sufficiently advanced to provide automated methods for doing the things that you want to do with your code.
    Fwiw, (I think) there is a demo of Dreamweaver Mx available for download at the Macromedia site.



    Note:
    Don't expect to get into the Macromedia site if you're on a Mac.
    Macromedia have recently rebuilt their site and in the process completely fukdup access to many mac users.
    Camino is not supported so is refused entry with no 'let me in anyway' option offered.
    Safari beta is alledgedly supported.
    It also refuses to recognise that I *already* have the latest version of the Flash player plugin, so I can't get past the front page anymore even if I'm using IE5.2 which *is* officially supported

    ... which is a tad fukn annoying, to say the least.
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  11. #11
    SitePoint Zealot
    Join Date
    Mar 2002
    Location
    Vancouver, USA
    Posts
    143
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    DOH didn't even think of the exchange. Still would be a handy stand alone tool

  12. #12
    SitePoint Zealot
    Join Date
    Mar 2002
    Location
    Vancouver, USA
    Posts
    143
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, found it, installed it, but it only takes out the <style> tag stuff in the header, not the inline.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •