Sitoo Web

 

Utseende på länkar

En viktig del av en hemsida är dess länkar, och en viktig del av länkarna är att tala om för besökaren vilken text som är en länk. Det gör du genom att definiera en länks utseende.

Innehåll

Skapa särskilt länkutseende för en speciell formatmall

Du styr det enklast genom att definiera olika länkutseenden beroende på vilken formatmall som texten använder sig av. Exempelvis så kan du då styra så att länkar i text med formatmallen "Normal" har ett utseende och länkar i text med formatmallen "Brödtext" har ett annat utseende.

(Exempel för formatmallen "Rubrik 3".)

1. Välj "Verktyg" > "Redigera formatmallar".

2. Klicka på "Lägg till".

3. Ge den ett namn och klicka därefter på "Avancerat" (t.ex Rubrik 3 - Länk).

4. I fältet "Selektor", skriv den ursprungliga formatmallens selektor följt av " a" (ett mellanslag följt av ett litet "a")* (t.ex: "h3 a, .h3 a").

5. Gör önskade inställningar för färger, typsnitt och liknande.

6. Klicka "OK".

7. Klicka på knappen "Stäng".

Nu är länkutseendet definierat och länkar i den formatmallen kommer att använda detta utseende, medan vanliga länkar använder standardutseendet.

  • Avancerat: Anledningen till att "a" skall skrivas in är att denna motsvarar HTML-kodens "anchor"-tagg; den som används när länkar skapas.

För att skapa länkutseenden för muspekning för länkarna etc, ange följande selektor för formatmallarna (se steg 2c):

a

- gäller övergripande för samtliga nedanstående

a:hover

- gäller endast för länken vid muspekning

a:active

- gäller när musen hålls nedtryckt på länken (innan man släpper musknappen och sidan byts)

a:visited

- gäller för de länkar vars mål (sidorna de länkar till) tidigare har besökts

a:link

- gäller för vanliga, obesökta länkar som inte pekas på eller på annat sätt interageras med

Skapa en generell länkstil

Länkutseendet gäller då för samtliga länkar där inget annat definierats.

1. Välj "Verktyg" > "Redigera formatmallar".

2. Se efter ifall du redan har mallar med namnen "Länk" eller motsvarande. Om du inte har det, klicka på "Lägg till".

  1. Döp denna till "Länk" och klicka på "Avancerat".
  2. I fältet "Selektor", skriv "a" (endast en bokstav; ett litet "A")*.
  3. Avancerat: Anledningen till att "a" skall skrivas in är att denna motsvarar HTML-kodens "anchor"-tagg; den som används när länkar skapas.

3. Välj formatmallen som skall ändras (om flera, välj den översta) och klicka på "Redigera".

4. Gör önskade inställningar för färger, typsnitt och liknande.

5. Klicka "OK".

6. Klicka på knappen "Stäng".

Nu är länkutseendet definierat.