History | Edit

Oxygen XML Editor supports the subject selector described in CSS Level 4 (currently a working draft at W3C http://www.w3.org/TR/selectors4/). This selector matches a structure of the document, but unlike a compound selector, the styling properties are applied to the subject element (the one marked with "!") instead of the last element from the path.

The subject of the selector can be explicitly identified by appending an exclamation mark (!) to one of the compound selectors in a selector. Although the element structure that the selector represents is the same with or without the exclamation mark, indicating the subject in this way can change which compound selector represents the subject in that structure.

Example:
table! > caption {
  border: 1px solid red;
}

A border will be drawn to the table elements that contain a caption, as direct child.

This is different from:
table > caption {
  border: 1px solid red;
}

This draws a border around the caption.

Taking Processing Instructions into Account in CSS Subject Selectors

You can test for the existence of specific processing instructions (PI) in the child hierarchy of a subject selector.

For example:
@namespace oxy "http://www.oxygenxml.com/extensions/author";

chapter! > oxy|processing-instruction[important][level="high"]{
  color:red;
}
This would change the color of a DocBook chapter to red if it contains the important processing instruction:
<chapter>
   <title>A title</title>
   <?important level='high'?>
</chapter>

Descendant Selectors Limitation

Important: The current implementation has a known limitation. The general descendant selectors are taken into account as direct child selectors. For example, the following two CSS selectors are considered equivalent:
a! b c
and:
a! > b > c