How to pack in html file: images, css and js?

Question

css

Good afternoon
Tell me, is there a technology that: will take a page with connected css and js, fonts and pictures, etc., and will give out a large, but only html file .
Perhaps pictures and fonts should not be embedded, but scripts and styles are a must.
What you need: to replace flash in the production of banners and text-graphic blocks.

Answer 1

Good day.
For example, you can not connect styles, but place them in a
JavaScript tag, place them in an
Image tag as a background in css, you can set the following. way:
Images on the page can be placed in the same way
Fonts in css:

@font-face {
    font-family: 'FontName';
    src: url(data:font/truetype;charset=utf-8;base64,{{base64_content}}) format('truetype'),
         url(data:font/woff;charset=utf-8;base64,{{base64_content}}) format('woff');
}

Where {{base64_content}} is the base64 encoded image.
You can encode here b64.io

Answer 2

Are you asking about a specific tool or how to theoretically do this?
If theoretically - then styles can be written either
or inline
With scripts - similarly, there is a
Pictures tag - google data uri.

Answer 3

This is all superfluous, at the moment, rich banners are quite embedded on pages as a single iframe.