Laurent : don't worry about the "offline" part. If you embedd your HTML page inside something like Phonegap, the tool is going to do what's needed to trick the browser into thinking he is "online".
In your new HTML page (we suppose it's a page from a larger book or magazine), you can put that code, from the index.html exported by C2 :
<div id="c2canvasdiv" style="margin: 0 auto; width: 1024px; height: 768px;">
<canvas id="c2canvas" width="1024" height="768">
</div>
The "div" isn't strictly necessary, but it's there to keep things cleaner (for example, some plugin can use it). Obviously, in your exported project, the width and height values can be different.
You also need to add that part at the bottom of the page, before "</body>" :
<script src="jquery.min.js"></script>
<script>window.jQuery || document.write("<script src='jquery-1.7.1.min.js'>\x3C/script>")</script>
<script src="c2runtime.js"></script>
Don't forget to put the "jquery.min.js" file at the root of your directory, next to your HTML page.
You can also find sme code between
<script>
jQuery(window).resize(function() {
[...]
document.addEventListener("visibilitychange", onVisibilityChanged, false);
document.addEventListener("mozvisibilitychange", onVisibilityChanged, false);
document.addEventListener("webkitvisibilitychange", onVisibilityChanged, false);
document.addEventListener("msvisibilitychange", onVisibilityChanged, false);
</script>
its not necessarily needed by a tool like Phonegap, so aren't forced to include it...