4. Adding a custom CSS style sheet

Procedure:

  1. Copy one of the following files depending on which configuration you want to customize:

    Configuration NameProcedure

    DITA

    Copy topic.css to custom/.

    DITA Map

    Copy map.css to custom/.

    DITA BookMap

    Copy bookmap.css to custom/.

    DocBook Assembly 5.1 and 5.2[a]

    Copy assembly.css to custom/.

    DocBook 5.0, 5.1 and 5.2[b]

    Copy docbook5.css to custom/.

    DocBook 4

    Copy docbook.css to custom/.

    XHTML Strict, Transitional and 1.1

    Copy xhtml1.css to custom/.

    XHTML 5

    Copy xhtml5.css to custom/.

    [a] DocBook Assembly 5.1 and 5.2 documents are styled using the same assembly.css CSS style sheet.

    [b] DocBook 5.0, 5.1 and 5.2 documents are all styled using the same docbook5.css CSS style sheet.

    For example, xhtml5.css looks like this:

    @import url(xhtml-config:css/xhtml5.css);
  2. Edit this file using a text editor and add one or more CSS rules after the @import directive.

    XHTML example:

    p {
        color: red;
    }

    DocBook 4 or 5 example:

    para {
        color: red;
    }
  3. Let's suppose this file is called stylesheet1.css and that you want your style sheet to be listed in the View menu as "Style sheet #1".

    Add the following css configuration element to your custom .xxe file:

    <css name="Style sheet #1" 
         location="stylesheet1.css" 
         alternate="true" />
  4. If you want to make your custom CSS style sheet the default one, add the following viewSettings configuration element:

    <viewSettings>
      <center css="Style sheet #1" />
    </viewSettings>