7.1. Simple dynamic evaluation of property values

concatenate(value, ..., value) may be used to specify a dynamically evaluated property value anywhere a static property value is allowed.

A dynamic property value is evaluated just before building the view corresponding to the subject of the selector:

  1. The value arguments are converted to strings and concatenated together. Note that pseudo-functions such as attr() or xpath() are evaluated in order to obtain their string values.

  2. The result of the evaluation is a string which is parsed as a property value.

Example 1 (XHTML), simple table formatting could be implemented using this feature:

td, th { 
    display: table-cell;
    text-align: concatenate(attr(align));
    vertical-align: concatenate(attr(valign));
    row-span: concatenate(attr(rowspan));
    column-span: concatenate(attr(colspan));
    border: 1 inset gray;
    padding: 2;
}

Example 2 (custom DTD) image name is the concatenation of a basename obtained from attribute name and an extension obtained from attribute format (see above to have a description of pseudo-function image()):

image {
    content: concatenate("image('", attr(name), ".", attr(format), "',-400,-200)");
}