Just nu i M3-nätverket
Jump to content

Länkar utan uderstrykning?


Mats Adolfsson

Recommended Posts

Mats Adolfsson

Hur f-n gör man länkar utna understrykningar som de som används här på e-forum? Jag har kikat i page source utan att hitta nån förklaring.

Link to comment
Share on other sites

Du använder Netscape som inte stödjer textdekoration när musen "hovarar" över en länk.

 

Hela idén är dock att köra med CSS (Cascading Style Sheets) som anger ingen text-dekoration.

 

Lek med detta (läggs in inom head-taggarna på varje sida):

<style type="text/css"><!--

a:hover { text-decoration: underline }

a:link { color: #blue; text-decoration: none }

a:visited { color: #red; text-decoration: none }

body { font-size: 10pt; font-family: Verdana, Helvetica, Arial }

</style>

 

(a:hover är när du i InternetExplorer rör musen över länken och då blir den understruken)

 

Prova också att leka med en generell CSS fil för hela sajten, som laddas in på varje sida från de angivna filen:

<link rel="stylesheet" type="text/css" href="min-stil.css"> (som ska ligga inom head-taggarna).

 

Textfilen du döpt till min-stil.css ska alltså innehålla detta:

<style type="text/css">

a:hover { text-decoration: underline }

a:link { color: #blue; text-decoration: none }

a:visited { color: #red; text-decoration: none }

body { font-size: 10pt; font-family: Verdana, Helvetica, Arial }

</style>

 

Lycka till,

Petra

 

Link to comment
Share on other sites

Mats Adolfsson

Jag ska testa ovanstående. Tack för ett mycket utförligt svar MEN Netscape stödjer ju ickeunderstykningar här på IDG's eforum...

OCH jag hittar ingar "hover" i page source när jag kikar efter det. Faktiskt hittar jag inget som tyder på nåt liknande. Finns det fler sätt?

Link to comment
Share on other sites

peppelorum

Ja, det finns betydligt lättare sätt att göra på.

Lägg till denna kod inom headen:

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

 

Sen skapar du en fil som heter stil.css och i där så kan du ha följande:

 

h1 { font: bold 14pt Arial, helvetica }

h6 { font: 9pt Arial, helvetica; color:#ffffff }

h6.b { font: bold 9pt Arial, helvetica}

h6.c { font: Arial, helvetica }

.f { font: bold 8pt Arial, helvetica }

 

td { valign: top; align: left ; font-family: Verdana, Arial, Helvetica, sans-serif}

 

p { font-family: Verdana, Arial, Helvetica, sans-serif}

br { font-family: Verdana, Arial, Helvetica, sans-serif}

 

input { font: 8pt Verdana, Arial, Helvetica, sans-serif}

 

textarea { font: 8pt Verdana, Arial, Helvetica, sans-serif}

 

select { font: 8pt Verdana, Arial, Helvetica, sans-serif}

 

option { font: 8pt Verdana, Arial, Helvetica, sans-serif}

 

A { text-decoration: none; color: #808080 }

A:hover { text-decoration: none; color: #ffffff }

 

Det är detta längst ner som bestämmer hur länkarna ska bete sig vid hover, du också med hjälp av denna fil bestämma hur typsnitten ska se ut på hela sidan, vilken färg etc.

 

detta är betydligt mycket lättare än att lägga in style:n i headen på varje sida, för vill du ändra något så måste du göra det på varje sida, med mitt exempel behöver du bara ändra i en enda fil.

 

Link to comment
Share on other sites

Det beror på att eForum har ett övergripande stylescript... om du kikar närmare på koden ser du att den kallar på <link rel="stylesheet" type="text/css" href="styles/forum.css"> där finns listan med alla koder de vill använda.

 

Att använda ett övergripande css sparar tid och om man vill ändra på typsnitt eller storlek behöver man bara ändra i forum.css istället för i varenda sida som gjorts.

Link to comment
Share on other sites

Har en vidare fråga ang. detta :

 

Funkar css i tabeller i Netscape?

Gjorde en site, men när jag tittade på den i Netscape när det var i en tabell så var texten/storlek Default. Kallade på en css-fil. Alltså inte i head:en. La sedan till i html-koden istället, alltså inte css utan vanligt font face, och då funkade det...

 

?

 

Michael

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.



×
×
  • Create New...