Here you will find a example Typoscript and the result of it after compressing

page {

includeCSS {

#This file will be wraped with media screen,print { ... }

file1 = fileadmin/layout/css/asd_screen,print.css

file1.media = screen,print

# This files will be wraped with nothing (meida = all)

file2 = fileadmin/layout/css/asd.css

file3 = fileadmin/layout/css/asd2.css

file3.media = all

}

includeJS {

asd_123= fileadmin/layout/js/app1.js

anything = fileadmin/layout/js/app2.js

file = fileadmin/layout/js/app3.js

}

headerData {

10 = TEXT

10.value {<meta .../>

<meta .../>

<link href="bla.css" type="text/css" rel="stylesheet" />

<script type="text/jscript" src="bla.js"></script>

}

}

}

plugin {

tx_bla123 {

_CSS_DEFAUL_STYLE = div {display:none}

}

}

After Compressing the Typoscript looks like:

page {

includeCSS {

# without images (ie < 8)

1 = typo3temp/merged_asdasdasdasdasdasdasdasdasdasd12.css

# with images (ie > 7 or other browser )

1 = typo3temp/merged_wi_asdasdasdasdasdasdasdasdasdasd12.css

}

includeJS {}

headerData {

10 = TEXT

10.value {<meta .../>

<meta .../>

}

}

}

plugin {

tx_bla123 {

_CSS_DEFAUL_STYLE =

}

}

The default CSS style of the plugins is also stored in a separated file located in the cache directory.