2
if you open the source code of a website using xoops by using the browser you will see something like this
<link rel="stylesheet" type="text/css" media="all" title="Style sheet" href="http://www.arabxoops.com/xoops.css" />
<link rel="stylesheet" type="text/css" media="all" title="Style sheet" href="http://www.arabxoops.com/themes/2010/css/style.css" />
the 2 first stylesheet are both called from the file theme.html
so that xoops.css will be the first stylesheet to load containing some css resets concerning some xoops elements (banner,blocks,....)
after that style.css contain the enhancement part (styling with images ..) and because it's after xoops.css it can override some css rules if you change them in style.css
after that come the tough part
here xoops put all css stylesheets called by php or the ones that change depending on some parameters
- like modules, some modules requires some css styling so they can add style sheet just by adding in the php side
$xoTheme->addStylesheet(XOOPS_URL . '/modules/yourmodule/style.css');
- like language some langage use right align and rtl so xoops add a style sheet arabic.css or english.css that have a big reset with a lot of !important
that is the big idea behind the magic of xoops css
I hope that you caught the idea