Can I definite a gadgrt like this (if I were admin): a gadget using a.css, b.css and c.css. It displays for all users, but gadget-b.css only works for Vector users and c.css only works for Monobook users?
Topic on Extension talk:Gadgets
i do not know the answer to the question as phrased, but i think the same goal can be achieved rather simply:
each of the skins' bodies declares a class, e.g., for vector, it's "skin-vector" and so on and so forth.
you can define a single css for the gadget, and precede each of the rules (or rather, each of the rules which are "skin specific") with .skin_XXX, so each of those rules in your unified css, will apply to specific skin only.
i understand this is not what you asked, exactly, but if i understood correctly what you are trying to do, i think "my" solution is simple and straightforward.
peace
There is a way to specify that the entire gadget is considered only if the current skin matches this or that particular one.
However, this was not your question. You want to run the gadget for every skin, but load particular resources depending on current skin.
Well, the current skin is known to the JS gadget, and depending on that you may load different CSS pages by mw.loader.load(). However, CSS definitions then arrive quite late and might change the first presentation in an undesirable way.
The suggestion made before is better: Load one common CSS resource from the first beginning, and distinguish by classes .skin-vector those rules which are not appropriate for all skins.
Alternatively, you could split your gadget into a single common gadget and skin-specific gadgets (so for your example you would end up with three gadgets), which would avoid the load timing issues of PerfektesChaos' suggestion. However, it would then require your users to enable separate gadgets for the same functionality (or require you to set multiple gadgets to active by default and maybe hidden depending on what you're after).
So again, the suggestion to use skin-specific classes in a single CSS file is the best option here.
Using class selector ".skin-vector" is OK, but not convenient. But body class doesn't include usergroups. Maybe I can use JavaScript.
With JavaScript you can do nearly everything, but at the risk of en:FOUC.
It is almost impossible to wait until CSS has been loaded and is in effect, then beginning to insert your HTML elements.
There are classes depending on user groups, like sysop or not anonymous, but IIRC they need to be defined by project. German Wikipedia can limit CSS visible to sysop only, e.g. a block user button which is meaningless for everybody else, or do not offer user preferences to anonymous users.
Another approach would be to use the ostracised inline style="" and create HTML elements only under certain conditions and provide specific CSS. Such inline style is present together with the element and does not depend on style sheets arriving later. By smart programming they allow centralised maintenance like class rules.