1. CSS - Cascading Style Sheets

    Artikel: AN0002380Aktualisiert: 13.12.2018
    Die vorgegebene Sprachenversion vom Artikeltext wird angezeigt, weil es kein Text von der ausgewählten Sprache und Version gibt.

    CSS (Cascading Style Sheets) is used to formatting HTML text. The original HTML text formatting was utilizing HTML tags. Today the original HTML formatting is used in a very limited way - you can see it just for setting up bold or italics - tags <b> and <i>.

    All the other formatting is solved by CSS. There are three ways of using CSS:

    1. Direct style

    Formatting is defined directly in the source text in the attribute style.

    Example:

    <p style="margin-left: 40px;">The paragraph will be indented 40 px from the left.</p>

    The paragraph will be indented 40 px from the left.

    If you are using ObjectGears HTML editor anad you choose e.g. font type or script colour, HTML editor will generate tag <span> and will use property style.

    2. Stylesheet defined in the document head

    In this way you can define at the beginning of the page e.g. how all the headlines should look like. This will ensure a consistent look across the whole page.

    <style>
    p {color: blue}
    </style>

    Above stated code in the head of the page will cause all the paragraphs in the page having a blue script.

    3. External file

    You will use an external stylesheet (file with the suffix .css), that will enable you to use in more page a style that you have defined just once. The page will refer to the file by means of tag <link>. If you refer in this way from all the pages, then they will look consistent.

    You will create a file with name e.g. my_styles.css. There will be just this text in the file:

    p {color: blue}

    You will state in pages, where you want to use this style, following:

    <link rel="stylesheet" type="text/css" href="my_styles.css">

    Advantages of using CSS in external file:

    • Styles in the file will be downloaded just once for the whole web. User can then navigate much faster in the web.
    • Size of the HTML page will be reduced substantially. The pages then have just their own information content.
    • You will perform the change just in one file once without need to do anything with the pages. The documentation that you are using now contains more than one thounsand pages and in case a change is needed, it is not possible anymore to change the pages one after another.

    You can use CSS in severall place in ObjectGears:

    We recommend Wikipedia and w3schools for more information about CSS.

×