Dot lists

Here you can create additional dot lists types. The different formats on the dot lists are created by using different CSS-formats. These formats can contain custom images if desired. There is also a numbered list to choose by default.
Dot lists

Click the plus sign to add a new dot list type. In Custom style you type CSS attributes to generate the appearance for the new dot list.

General

Name

Here you fill in a descriptive name in the field for Name. In the example above Numbered.

Description

Here you add a description (optional).

Numbered

Check this box of you would like a numbered list. Then you will have the common numbered list. If you for example would like roman numbers in the numbered list you can combine the numbered list with Custom style (OL/UL). See example below.

CSS

Custom style (OL/UL)

Here you can fill in css-attributes for the appearance of the list.
If you for instance would like an image as dot list you type:

list-style-image:url('/images/18.114ef621022023501d80003093/dubbelpil.gif');

To retrieve the id for an image: Go to the image archive -> right click on the desired image -> choose properties.

Skärmdump på idnummer på bild

It can be a good idea to specify a list-style-type in case the image is not available for some reason.

list-style-image:url('/images/18.114ef621022023501d80003093/dubbelpil.gif'); list-style-type: square;
If you would like to have a list with squares instead of circles you type:

list-style-type: square;

Square

If you would like a numbered list but with other numbers than the our common, for instance roman number, you first check the box Numbered and then you type:

list-style-type: upper-roman;

Romersk lista

Custom style (LI)

Here you can fill in css attributes for how the alternatives should appear, for instance distance upwards or downwards.

When you have changed the ordinary dot list style for another dot list you can not return to the common dot list. Therefor it is a good idea to also add the ordinary dot list type.

The dot lists you add does not function like the common dot list with automatic indentation but has indentation as default setting. You can choose to remove the indentation by setting a margin on the list.

If you do not want an indentation to the left you type in Custom style (LI):

margin-left:-20px;

If you would like a larger space between the dots you type in Custom style (LI):

margin-bottom:5px; (byt ut 5px mot det avstånd du vill ha).

CSS-attributes for lists

The most common types of non numbered lists:

  • list-style-type: disc
  • list-style-type: circle
  • list-style-type: square
  • list-style-type: none - no dot, only indentation

The most common types of numbered lists:

  • list-style-type: decimal - ordinary numbering
  • list-style-type: lower-roman - roman chars lower-case
  • list-style-type: upper-roman - roman chars upper-case
  • list-style-type: lower-alpha - alphabetical numbering lower-case
  • list-style-type: upper-alpha - alphabetical numbering upper-case

Custom images:

  • list-style-image:url('address to image');

This function requires the right Site properties.

Denna sida publicerades: 2015-11-18

Skriv ut PDF-avsnitt

Hjälpte informationen på den här sidan dig?

Missa inga nya rön, tips och tricks! Prenumerera på insite!

Find us!

SiteVision AB (Headquarter)
Vasagatan 10
702 10 Orebro
Sweden

Info: +46 19-17 30 30
Support: +46 19-17 30 39

Latest Tweets