Avatar billede oersted Novice
01. oktober 2002 - 01:39 Der er 20 kommentarer og
1 løsning

probl med CSS

Hvem gider kigge lidt på min kode..
Der er problemer med style i IE 5.0 Her vises ikke links og tekst i den rigtige farve, men de sædvanlige blå og lilla :::: Urrgh

Desuden kunne den sikkert trænge til lidt oprydning

<html>

    <head>
        <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
        <meta http-equiv="pragma" content="no-cache">
        <meta http-equiv="Expires" content="Mon, 04 Dec 2000 21:29:02 GMT">
        <meta name="description" content="jspr web og grafisk design 2002">
        <meta name="keywords" content="web sites, visual identity, flash, banner design, grafisk, reklame">
        <meta name="author" content="Jesper Stevnhoved">
        <title>JSPR - web sites  visual identities  flash</title>

        <style>         a:link{color: #999999;text-decoration:none;}
        a:visited{color: #999999;text-decoration:none;}
        a:active{color: #999999;text-decoration: underline;}
        a:hover{ color: #CCCCCC;text-decoration:underline;}
</style>
</html>
<head>
<script language="JavaScript">
<!-- Gem koden for gamle browsere
function PopWin(url,h,w) {
popupWin = window.open(url, 'CLIENTS', 'height=' + h + ',width=' + w + ',top=50,left=25')
}
// -->
</script>
    </head>
    <body onLoad="PopWin('clientsaj.html',200,200);">        <table width="100%" height="580" border="0">
  <tr>    <td width="40%" colspan="2">&nbsp;</td>
    <td width="300">&nbsp;</td>

    <td width="40%">&nbsp;</td>
  </tr>
  <tr>    <td width="40%" valign="top"> <table width="75%" border="0" align="center" cellspacing="5">
        <tr>          <td>&nbsp;</td>
        </tr>
        <tr>          <td>&nbsp;</td>
        </tr>

        <tr>          <td>&nbsp;</td>
        </tr>
        <tr>          <td height="20" valign="top">&nbsp;</td>
        </tr>
        <tr>          <td>&nbsp;</td>
        </tr>
        <tr>          <td>&nbsp;</td>

        </tr>
        <tr>          <td>&nbsp;</td>
        </tr>
        <tr>          <td>&nbsp;</td>
        </tr>
        <tr>          <td>&nbsp;</td>
        </tr>

        <tr>          <td>&nbsp;</td>
        </tr>
        <tr>          <td>&nbsp;</td>
        </tr>
        <tr>          <td><div align="right"><font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#999999">JSPR
              </font></div></td>
        </tr>
        <tr>          <td><div align="right"><font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#999999">JESPER
              STEVNHOVED</font></div></td>

        </tr>
        <tr>          <td><div align="right"><font color="#999999" size="1" face="Verdana, Arial, Helvetica, sans-serif">TEL:
              2016 2334</font></div></td>
        </tr>
        <tr>          <td><div align="right"><font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#999999"><a href="mailto:jesper@jspr.dk">JESPER@JSPR.DK</a></font></div></td>
        </tr>
        <tr>          <td>&nbsp;</td>

        </tr>
      </table>
      <p align="right"><font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#999999"><br>
        </font></p>
      <p align="right">&nbsp;</p></td>
    <td width="40%" valign="top"><table width="100%" border="0" cellspacing="5">
        <tr>          <td><font color="#999999" size="1" face="Verdana, Arial, Helvetica, sans-serif, color: #999999;"><strong>JSPR
            HAR PRODUCERET WEB SITES FOR:</strong></font></td>
        </tr>

        <tr>          <td><font color="#999999" size="2" face="Verdana, Arial, Helvetica, sans-serif"><a href="http://www.saj-ing.dk" target="_blank">sAj</a></font></td>
        </tr>
        <tr>          <td><font color="#999999" size="2" face="Verdana, Arial, Helvetica, sans-serif"><a href="http://www.eicmf.dk/" target="_blank">EICMF</a>            </font></td>
        </tr>
        <tr>          <td height="20" valign="top"><font color="#999999" size="2" face="Verdana, Arial, Helvetica, sans-serif"><a href="http://www.modernizm.dk" target="_blank">moderniZm</a></font></td>

        </tr>
        <tr>          <td><font color="#999999" size="2" face="Verdana, Arial, Helvetica, sans-serif"><a href="http://www.gallerikramer.adr.dk" target="_blank">Galleri
            Kramer</a></font></td>
        </tr>
        <tr>          <td height="20"><font color="#999999" size="1" face="Verdana, Arial, Helvetica, sans-serif"><a href="http://www.acubator.dk" target="_blank">ACUBATOR</a></font></td>
        </tr>
        <tr>          <td><font color="#999999" size="1" face="Verdana, Arial, Helvetica, sans-serif"><a href="http://www.jspr.dk/raw/web_001.html" target="_blank"><font size="2">rentAwebmaster</font></a><font size="2"><br>

            </font></font><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#999999">(opl&aelig;g)</font></td>
        </tr>
        <tr>          <td><font color="#999999" size="2" face="Verdana, Arial, Helvetica, sans-serif"><a href="http://www.jspr.dk/medieuropa.html" target="_blank">medieuropa</a></font></td>
        </tr>
        <tr>          <td><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#999999"><a href="http://shn.smalsag.dk" target="_blank">SHN</a></font></td>
        </tr>

        <tr>          <td><font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#999999">-----</font></td>
        </tr>
        <tr>          <td><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#999999"><a href="http://www.jspr.dk/site2001.html" target="_blank">JSPR
            2001</a></font></td>
        </tr>
        <tr>          <td><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#999999"><a href="http://www.jspr.dk/xmas.html?" target="_blank">xmas
            2001</a></font></td>
        </tr>

        <tr>          <td>&nbsp;</td>
        </tr>
        <tr>          <td>&nbsp;</td>
        </tr>
        <tr>          <td>&nbsp;</td>
        </tr>
        <tr>          <td>&nbsp;</td>

        </tr>
      </table></td>
    <td height="20" valign="top"> <div align="center">        <p align="left">&nbsp;</p>
      </div></td>
    <td width="40%">&nbsp;</td>
  </tr>
</table>
<p> </p>

    </body>

</html>


http://www.jspr.dk
Avatar billede keysersoze Ekspert
01. oktober 2002 - 01:41 #1
er det det man kan se på linket jspr.dk?
Avatar billede oersted Novice
01. oktober 2002 - 02:06 #2
ja
Avatar billede sukos Juniormester
01. oktober 2002 - 04:02 #3
<style type="text/css">
        a:link{color: #999999; text-decoration:none;}
        a:visited{color: #999999; text-decoration:none;}
        a:active{color: #999999; text-decoration: underline;}
        a:hover{ color: #CCCCCC; text-decoration:underline;}
</style>
Bruger altid selv <style type="text/css">, og husk at lave mellemrum efter hver "kommando"
Avatar billede knudgert Nybegynder
01. oktober 2002 - 05:03 #4
Rækkefølgen skal være
a:link
a:visited
a:hover
a:active

Som det er nu skiftes ikke farve ved active, men hverken det eller manglende type burde være årsag til problemet.

PS. Hvorfor bruger du dog ikke css i større udstrækning, så slap du f.eks. for alle de font face?
Avatar billede oersted Novice
01. oktober 2002 - 09:39 #5
fordi jeg som du kan se ikke rigtigt har fattet hvordan det virker :)

øøh, Stylesheetet øverst burde vel gælde hele dokumentet ?
Avatar billede oersted Novice
01. oktober 2002 - 09:56 #6
17: tag: " head" invalid inside tag: "head". " head" closing tag is optional. Validation will proceed as if context is closed.       

18: in tag: script the following required attributes are missing: type           

64:  In HTML 4.0, FONT is deprecated. It may become obsolete in future versions, consider using style sheets instead.   
- gælder selvfølgelig alle lignende steder..

149: No starting tag found for: "html", or it was closed too many times
Avatar billede 1409 Praktikant
01. oktober 2002 - 17:32 #7
<html>

    <head>
        <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
        <meta http-equiv="pragma" content="no-cache">
        <meta http-equiv="Expires" content="Mon, 04 Dec 2000 21:29:02 GMT">
        <meta name="description" content="jspr web og grafisk design 2002">
        <meta name="keywords" content="web sites, visual identity, flash, banner design, grafisk, reklame">
        <meta name="author" content="Jesper Stevnhoved">
        <title>JSPR - web sites  visual identities  flash</title>

        <style>        a:link{color: #999999;text-decoration:none;}
        a:visited{color: #999999;text-decoration:none;}
        a:active{color: #999999;text-decoration: underline;}
        a:hover{ color: #CCCCCC;text-decoration:underline;}
</style>
</html>
<head>
<script language="JavaScript">
<!-- Gem koden for gamle browsere
function PopWin(url,h,w) {
popupWin = window.open(url, 'CLIENTS', 'height=' + h + ',width=' + w + ',top=50,left=25')
}
// -->
</script>
    </head>
DEN er gal!!!
Lige efter </style> skal
</html>
<head>
fjernes!

Er det med vilje at fonte-størrelserne er forskellige???
Så kan style-blokken laves om og samtlige FONT-tags fjernes.
<STYLE TYPE="text/css">
    BODY, TD {
        color : #999999;
        font-family : Arial, Helvetica, sans-serif;
        font-size : 12px;
    }
    A  {
        color : #999999;
        text-decoration:none;
    }

    A:Visited  {
        color : #999999;
        text-decoration:none;
    }

    A:Active  {
        color : #999999;
        text-decoration:none;
    }

    A:Hover  {
        color : #CCCCCC;
        text-decoration:underline;
    }
</STYLE>
Og kommentar til farverne: De er absolut ikke brugervenlige! Hverken på den alm. tekst eller på linksene - man kan ikke se hvilke links, man har besøgt og ikke har besøgt, hvilket jeg som bruger bliver irriteret over.
Avatar billede oersted Novice
01. oktober 2002 - 18:19 #8
Jeg kigger på det senere..

"man kan ikke se hvilke links, man har besøgt og ikke har besøgt, hvilket jeg som bruger bliver irriteret over."  - det har du ret i
Avatar billede oersted Novice
02. oktober 2002 - 09:14 #9
OK. Hvordan "navngir" jeg, hvis jeg vil have en del af teksten 10 px ? - for eksempel:

<tr>
          <td><div align="right">JSPR</div></td>
        </tr>
        <tr>
          <td><div align="right">JESPER STEVNHOVED</font></div></td>
        </tr>
        <tr>
          <td><div align="right">TEL: 2016 2334</div></td>
        </tr>
        <tr>
          <td><div align="right"><a href="mailto:jesper@jspr.dk">JESPER@JSPR.DK</a></div></td>
        </tr>
        <tr>
Avatar billede 1409 Praktikant
02. oktober 2002 - 11:52 #10
Du kan oprette en ekstra CSS-class til det, hvor jeg også ville højre-stille teksten:
<STYLE TYPE="text/css">
    BODY, TD {
        color : #999999;
        font-family : Arial, Helvetica, sans-serif;
        font-size : 12px;
    }
    A  {
        color : #999999;
        text-decoration:none;
    }

    A:Visited  {
        color : #999999;
        text-decoration:none;
    }

    A:Active  {
        color : #999999;
        text-decoration:none;
    }

    A:Hover  {
        color : #CCCCCC;
        text-decoration:underline;
    }
    TD.small {
        font-size : 10px;
        text-align : right;
    }
</STYLE>
----------
        <tr>
          <td CLASS="small">JSPR</td>
        </tr>
        <tr>
          <td CLASS="small">JESPER STEVNHOVED</td>
        </tr>

TD.class vil automatisk "overrule" formateringen i BODY, TD.
Avatar billede oersted Novice
02. oktober 2002 - 19:14 #11
hvor præcist placerer jeg den kode ?
Avatar billede oersted Novice
02. oktober 2002 - 19:16 #12
beklager knudgert, som lader til at min nye mac-guru.. og sukos, men det ladet til 1409 serverer det på et fad her, og det har jeg vist brug for, for at lære det ordentligt
Avatar billede oersted Novice
02. oktober 2002 - 19:17 #13
lader til at være ....
Avatar billede knudgert Nybegynder
02. oktober 2002 - 21:14 #14
Der er da helt i orden, at du ikke accepterer mirt svar, som ikke var så meget svar (og burde nok have været en kommentar).

Men du bør stadig bytte om på rækkefølgen, som jeg skrev.
Ellers vil det ikke virke helt som det skal.
Avatar billede 1409 Praktikant
02. oktober 2002 - 22:15 #15
SERVERET PÅ ET SØLVFAD - næsten!

<STYLE TYPE="text/css">
bla., bla., bla...
</STYLE>

placeres ofte i HEAD-området, som du har gjort, altså et eller andet sted mellem <HEAD> og </HEAD> (den nøjagtige placering i HEAD-området er underordnet).

Men selv foretrækker jeg at, oprette et eksternt CSS-dokument, da det er langt mere fleksibelt.

Opret et dokument med fx. navnet "eksempel.css". Indholdet i dette tilfælde er følgende:

BODY, TD {
        color : #999999;
        font-family : Arial, Helvetica, sans-serif;
        font-size : 12px;
    }
    A  {
        color : #999999;
        text-decoration:none;
    }

    A:Visited  {
        color : #999999;
        text-decoration:none;
    }


    A:Hover  {
        color : #CCCCCC;
        text-decoration:underline;
    }

    A:Active  {
        color : #999999;
        text-decoration:none;
    }

    TD.small {
        font-size : 10px;
        text-align : right;
    }

Bemærk der IKKE skal stå <STYLE TYPE="text/css"> i starten eller </STYLE> i slutningen.
Så linker du din eller dine HTML-filer til det i HEAD-området (igen, den nøjagtige placering i HEAD-området er underordnet):

<LINK REL="STYLESHEET" TYPE="text/css" HREF="eksempel.css">

Resten - class'erne i tags'ene - er præcis de samme.
I alle de HTML-filer du laver og linker til CSS-filen, vil fx. teksten så blive #999999 i Arial og 12px.

(Og så stiller vi tilbage til studiet...!)
Avatar billede oersted Novice
02. oktober 2002 - 22:46 #16
hmmm, der er noget jeg skal fatte her
Har du evt tid til at svare på et par spm i morgen ?
Vi taler om dokument, som ligger uden for html'en ? - jeg har intet fattet af CSS, men det ser ud til at være til at overskue...
Avatar billede 1409 Praktikant
02. oktober 2002 - 23:35 #17
Jep, vi taler om et ikke-HTML-dokument, nemlig et .css-dokument, hvorfra de forskellige formateringer automatisk indlæses (fx. font-size: 12px og color: #FF0000).

Jeg kan varmt anbefale denne gode site, som bla. er med en virkelig god CSS-guide med samtlige officielle formaterings-muligheder og en komplet oversigt over alle HTML-tags. De er begge guld værd og kan også downloades: http://www.htmlhelp.com/
Avatar billede oersted Novice
02. oktober 2002 - 23:49 #18
hva er så lige idéen, i et hyperenkelt site, som mit eget i at tage det ind fra en fil - der er jo kun to forskellige styles ...


jeg kan selvfølgelig se i dén med mere komplekse sites
Avatar billede knudgert Nybegynder
03. oktober 2002 - 06:45 #19
Du kan undgå at skrive f.eks.
<font color="#999999" size="2" face="Verdana, Arial, Helvetica, sans-serif">
så mange gange, som du gør.
Du kan nøjes med at skrive det en gang.

Og på et tidspunkt vil <font ...> ikke længere blive understøttet af browserne, omend der nok går nogen år.

Og det er faktisk ikke anbefalet at bruge i dag.
Avatar billede oersted Novice
03. oktober 2002 - 09:50 #20
ok.
Avatar billede 1409 Praktikant
03. oktober 2002 - 10:45 #21
Jeg ved ikke, hvor mange sider dit site består af, man lad os sige at du har fire sider. På et tidspunkt finder du ud af, at du vil ændre font-typen til Times New Roman og link-farven til grøn.
Ved at bruge eksternt css-dokument, så behøves du kun at ændre to steder i alt. Nemlig:
BODY, TD {
        color : #999999;
        font-family : Arial, Helvetica, sans-serif; >> "Times New Roman", Times, serif;
        font-size : 12px;
    }
Og:
A  {
        color : #999999; >> #00FF00;
        text-decoration:none;
    }

Hvis du så efterhånden udvider siten til flere sider - om det er med een eller 1000 er underordnet - så vil det du har skrevet i CSS'en gælder alle sider, så længe du linker til det.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester