Avatar billede webbygger Nybegynder
28. juli 2003 - 20:53 Der er 10 kommentarer og
5 løsninger

Hvordan griber man CSS an..

Jeg har snuset lidt til css ( bøger + nettede ), MEN jeg kan desværre ikke hitte "den røde TRÅD".
Jeg kan godt se det logisk i css og jeg har også prøvet diverse tutorials med mindre held :o|

Har lige nogle spørgsmål ;o)

1. Hvad er der forskel på # og .  ?

2. Jeg har  hentede nogle CSS layout på nettede for se hvordan de virker, men hvordan overføre man det til ens egen webside ( Dreamweaver ) f. eks :
#indhold {
      background:#ffe;
      margin-top:10px;
      margin-left:200px;
      border:1px solid black;
      padding-bottom:10px;
      padding-top:10px;
      min-width:500px;
Er det et layer jeg skal tilføje denne css eller hva....?

3. Når man nu har delt sin web-side op i kasser som f.eks
http://www.webdesign101.dk/css/csslayout/favoritlayout1.php

Skal siden så reloade hver gang man klikke på et menu-link ?

4. Hvordan for man f.eks logo og menuen overført på alle web-side på webstedet..?

Et fornuftig svar  give 40 p. pr. spørgesmål
Avatar billede miss-g Seniormester
28. juli 2003 - 20:55 #1
Her står lidt mere om stylesheets:
http://www.html.dk/tutorials/css/
Avatar billede webbygger Nybegynder
28. juli 2003 - 20:58 #2
miss-g : dem har jeg læst og prøvet, men jeg forstå det desværre ikke endnu ;o)
Avatar billede zkn Nybegynder
28. juli 2003 - 20:59 #3
Ved at have det samme stylesheet linket på alle sider kan ved en simpel opbygning have de samme "kasser" eller menu'r på alle sider.
og forskellen på # og . er at . er class og # er id fx
#navn{ color:red;} <div id="navn">rød text</div>
.navn{color:green;} <div class="navn">grøn text</div>
Avatar billede zkn Nybegynder
28. juli 2003 - 21:03 #4
det du har her:
#indhold {
      background:#ffe;
      margin-top:10px;
      margin-left:200px;
      border:1px solid black;
      padding-bottom:10px;
      padding-top:10px;
      min-width:500px;
}
kan du bruge på din egen side ved at lave en <div id="indhold">text</div>
forudsagt at du selvfølgelig har et link til css documentet ala <link rel="stylesheet" type="text/css" href="stil.css">
eller laver en <style></style> i dit head med dit css i.
Avatar billede exp Juniormester
28. juli 2003 - 21:10 #5
Synes det er mange point du har afsat...

1. # definerer en id - i den daglige brug er der ikke den store forskel, men i det øjeblik du skal have valideret dit css-dokument betyder det noget. Groft sagt bruger du # (id) hvis det er et specifikt element der skal formateres, fx hovedvinduet på din side, du bør altså kun bruge hver id én gang pr side
. er class'es der i forlængelse med ovenstående kan bruges på alle de elementer du ønsker pr. side, fx links, billeder eller hvad ved jeg.


2. Det stykke kode du her viser lægger du i et dokument du kalder style.css, dette lægger du så op på din server.
i dit html-dokument skriver du så følgende mellem <head> og </head>:

<link REL="stylesheet" HREF="style.css" TYPE="text/css">

og nede i dokumentet skriver du:

<div id="indhold">tekst</div>


3. Alt efter hvilken menu du bruger kan det godt ske at du skal reloade hver gang - det kan ike helt betale sig, derfor bør du nok bruge noget javascript


4. Den letteste måde at gøre det på er vi frames eller serverside includes
Avatar billede webbygger Nybegynder
28. juli 2003 - 21:10 #6
Zkn skriver : Ved at have det samme stylesheet linket på alle sider kan ved en simpel opbygning have de samme "kasser" eller menu'r på alle sider.

Er det, det sammen som eksternt style sheet...?
Avatar billede mik789 Nybegynder
28. juli 2003 - 21:14 #7
sp.1:
# angiver et unikt id til et element. du kan kun have én id af samme navn på siden. Hvis du f.eks. har en tabelcelle der skal have en særlig layout, kan du give den en id sådan: <td id="specielcelle">, og i dit stylesheet har du så de formatteringer der specielt gælder for denne celle, nemlig f.eks. som:

#specielcell {
  background-color: red;
}

. derimod angiver en klasse af fælles formatteringer der kan bruges flere steder på siden. Hvis du f.eks. har flere celler du godt vil have røde, og måske også andre elementer, kan du bruge denne klasse:

.roed {
  background-color: red;
}

og du kan så bruge den i din html, f.eks. sådan: <span class="roed">rød baggrund for min tekst</span>, eller sådan: <td class="roed">tekst i cellen</td>

sp.2:
den layout du har hentet kan jo bruges på mange forskellige elementer, det kan være et lag (dvs. en <div> eller en tabelcelle eller meget andet. I så fald laver du det som en klasse (altså med . i stedet for #). Men hvis du kun vil bruge det en enkelt sted, beholder du bare #'en.

sp4.
Ved at lave et eksterns stylesheet som du linker til på alle dine sider. Skriv:
<link rel="stylesheet" type="text/css" href="style.css"> og placer dette tag imellem <head> og </head>. Du kan selvfølgelig kalde css-filen alt mulig andet en "style", men den skal have ekstensionen .css.

kom igen med flere spørgsmål ;-)
//mik
Avatar billede exp Juniormester
28. juli 2003 - 21:14 #8
ja, lige præcis - jf teksten på det link miss-g smider 28/07-2003 20:55:37, nærmere betegnet her:
http://www.html.dk/tutorials/css/lektion2.asp

mht. det med class og id:
http://www.html.dk/tutorials/css/lektion7.asp

Er du sikker på du har læst den tutorial særlig grundigt?
Avatar billede webbygger Nybegynder
28. juli 2003 - 21:19 #9
Nu skriver I TYPE="text/css", jeg troede at #indhold var en boks eller et layer..?

exp : Jeg er bare taknemlig over nogle gider og hjælp mig. Sålænge jeg har point sååå...
Avatar billede mik789 Nybegynder
28. juli 2003 - 21:21 #10
og lige et par ting til...

dit eksterne stylesheet er en fil for sig. det indeholder kun dine formatteringer uden andre dikkedarer. Det starter altså lige på, f.eks:

body {
  margin: 0px;
}

og slutter også med den sidste style.

Hvis du derimod har et internt stylesheet skriver du formatteringer i dit html dokument mellem <head> og </head> sådan:

<style type="text/css"><!--
body {
  margin: 0px;
}
[og de følgende dernedad]
--></style>
Avatar billede spe Nybegynder
28. juli 2003 - 21:21 #11
Jeg har skrevet en kort introduktion til CSS godt nok i forbindelse med Adobe GoLive men her står lidt om grundideen så måske kan du få gavn af at læse det: http://www.dtpkursus.dk/golive/sidergolive/golive.html
Avatar billede mik789 Nybegynder
28. juli 2003 - 21:22 #12
type angiver hvilken slags fil parseren skal fortolke. et eksternt stylesheet er en tekst fil af typpen css i modsætning til f.eks. et script som kan have type="text/javascript"
Avatar billede exp Juniormester
28. juli 2003 - 21:22 #13
TYPE="text/css" gør at browseren ved at det er et stylesheet der linkes efter her, en såkaldt MIME-type <== temmelig teknisk, det tror jeg ikke du skal tænke så meget over lige nu *s* Er først selv lige begyndt at sætte mig ind i det, og jeg er vel hvad man kan kalde garvet css'er *g*
Avatar billede webbygger Nybegynder
28. juli 2003 - 21:33 #14
Hvordan fordeler jeg point uden nogle bliver fornærmet... sådan ca. 30 til hver måske..;o)
Avatar billede mik789 Nybegynder
28. juli 2003 - 21:34 #15
you're the boss there!
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