CSS Inliner

<img src=“https://secure.travis-ci.org/KitaitiMakoto/css_inliner.png?branch=master” alt=“Build Status” />

CSS Inliner is a command-line tools to inline CSS into style attribute of each HTML element.

HTML here…

<html>
  <head>
    <title>Sample HTML</title>
    <style type="text/css">
      body {color: black;}
      p {line-height: 2em;}
    </style>
  </head>
  <body>
    <p>This is sample HTML document. In this paragraph, text is black and line has double height of font size.</p>
  </body>
</html>

… becomes like this:

<html>
  <head>
    <title>Sample HTML</title>
  </head>
  <body style="color: black;">
    <p style="line-height: 2em;">This is sample HTML document. In paragraph, text is black and line height is twice of font size.</p>
  </body>
</html>

INSTALL

As a RubyGem

$ gem install css_inliner

From Repository

$ git clone git://gitorious.org/css_inliner/css_inliner.git
$ cd css_inliner
$ rake install

USAGE

As Command-Line Tools

Note that options are not stable.

css-inliner

$ css-inliner --help

$ css-inliner file1.html(output to stdout)
$ css-inliner file2.html > result2.html
$ css-inliner file3.html --output=result3.html
$ css-inliner file4.html --element=body(output only body element)
$ css-inliner file5.html --in-place(overwrite file5.html)
$ css-inliner file6.html --in-place=.bak(create a backup file as file6.html.bak)

css-inliner-multifile

$  css-inliner --help

$  css-inliner-multifile ./dir1/*.html(output all result to standard output)
$  css-inliner-multifile ./dir2/*.html --dir=./resultdir
$  css-inliner-multifile ./dir3/*.html --element=body
$  css-inliner-multifile ./dir4/*.html --in-place=.bak

As a Library

Note that this is not stable at all.

require 'css_inliner'

html = File.read(sample.html)

CSSInliner.process html, '.' # => CSS-inlined HTML
CSSInliner.process html, '.', 'body' # => body element(<body> ... </body>)
CSSInliner.process html, '.', 'article' # => The first article element
CSSInliner.process html, 'http://example.net/stylesheets' # Passed URI will be used as base directory when resolving relative URI of CSS

Note

Note that

<link rel="stylesheet" href="...">

and

<style type="text/css"> ... </style>

will be removed in process.

History

0.3.2 / 2013-01-01

  • Expand dimensions(top, right, bottom, left) and properties of borders(style, width, color) when inlining

0.3.1 / 2012-07-17

  • [BUG FIX]Fix an error which occurs when parsing non-XHTML documents

  • Change homepage: Gitorious -> GitHub

  • Reimplement some tests which have pended

0.3.0 / 2012-05-28

  • Group external CSS files refered by <link> element by “title” attribute.

  • Work on progress: CSSPool::CSS::Declaration#expand_dimension

LICENSE

CSS Inliner is copyright © 2011, 2012, 2013 KITAITI Makoto. Distribued under the MIT license, see LISENCE file for the term.