Avatar billede maqhem Nybegynder
23. april 2006 - 12:29 Der er 13 kommentarer og
3 løsninger

benyttelse af egne klasser

hejsa!

Nu fandt jeg dette eksempel på nettet:

<html>

<head>
<style type="text/css">
h1 {color: #00ff00}
h2 {color: #dda0dd}
p {color: rgb(0,0,255)}
</style>
</head>

<body>
<h1>This is header 1</h1>
<h2>This is header 2</h2>
<p>This is a paragraph</p>
</body>

</html>

Og det ser nu rigtig fint ud, men problemet er, at jeg ikke vil have det til at være h1, h2 eller p - det skal være et navn, som JEG finder på, og som INGEN kommando har - hvordan gøres dette?

...og en sidste ting: Jeg vil gerne har css-scriptet klippet ud af min html-kode, sådan at den befinder sig i en seperat css-fil - hvordan gøres dette så?

På forhånd tak!

Nicolaj
Avatar billede maqhem Nybegynder
23. april 2006 - 12:29 #1
'Jeg vil gerne har css-scriptet' = 'Jeg vil gerne have' css-scriptet
Avatar billede maqhem Nybegynder
23. april 2006 - 12:32 #2
det går da godt :)

'Jeg vil gerne have css-scriptet'

Håber det er bare en smugle forståeligt ;)


Jeg synes at have set, at man kan komme punktummer foran eller sådan, eller en havelåge-ting: #. Er det ikke sådan noget i den stil?
Avatar billede jokkejensen Novice
23. april 2006 - 12:39 #3
Et elemenet kan tildeles en klasse eller et id..


<p id="mitID">text</p>
<p class="minKlasse">text</p>

Dem rammer du så forhåndsvist med

#mitID
{

}

.minKlasse
{

}

Det er også mulighed for lidt mere avancerede selectors, men kig eventuelt på : http://www.w3schools.com/css/default.asp

Her forklares hvordan man ligger det i et eksternt stylesheet :

http://www.w3schools.com/css/css_howto.asp
Avatar billede maqhem Nybegynder
23. april 2006 - 13:59 #4
hvad er forskellen mellem en klasse og en id?

Og er p'et 100 % uden funktion?
Avatar billede jokkejensen Novice
23. april 2006 - 14:26 #5
Kender ikke til forskellen på id og klasse, men rent forståelsesmæssigt bruger jeg id til mine containers, altså ex et div der indeholder en række klasser, det gør det lettere forståligt for mig ex:

<div id="menu">
<a> link </a>
<a> link2</a>
</div>
<div id="indhold">
<p> tekst <a> et link </a></p>
</div>

her kan jeg ramme mine links i menuen med

(rammer a tags i menu id'et)
#menu a
{
color: red;
}
(rammer a tags i indhold id'et)
#indhold a
{
color:black;
}

Samme kan laves med klasser, men syntes at bruge et id, giver mere overblik, hertil skal tilføjes at et id selvfølgelig skal være uniqt, der må ikke optræde flere elementer med samme id på en side.

Nej et <p> har selvfølgeligt en række forud definerede egenskaber, ex display:block, lidt padding og margin... disse kan bare overskrives gennem css
ex:

p
{
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
display:inline;
osv.
}

Det er mest fornuftigt at bruge de allerede eksisterende html tags, dette gør det ex lettere for søgemaskiner at kende forskel på overskrifter og indhold..
Avatar billede schwarz84 Nybegynder
23. april 2006 - 14:29 #6
p'et afgrænser en den af teksten (paragraph). Det har ikke umiddelbart nogen visuel funktion ud over at der automatisk laves et linjeskift efter.
Forskellen på klasse og id er at du godt kan have flere tags med samme klasse, mens et givent id kun må sættes på ét element.
Det er ligesom med p-tagget noget semantisk, ikke noget visuelt.
Avatar billede maqhem Nybegynder
23. april 2006 - 19:35 #7
DER fangede du dén, schwarz84:

"ud over at der automatisk laves et linjeskift efter"

DET er mit problem. Jeg vil have, at den ikke laver noget ud over dét, som jeg definerer... :D
Avatar billede roenving Novice
24. april 2006 - 00:28 #8
Så lad være med at bruge p-tags, som betyder (tekst-) afsnit, og derfor opfører sig i retning af den måde et afsnit i et dokument vil være opsat, altså ganske ofte med noget ekstra luft mellem afsnittene (og der er også forskel på browsernes måde at gøre dette på !-)

-- skal du sætte properties på tekst, der kommer fortløbende bruger du et inline-tag som f.eks. span, skal du have det som en selvstændig blok, bruger du et block-level tag som f.eks. div ...

-- og forskellen på inline og block er, som hvis du markerer 3 ord i en tekst i et tekstbehandlingsprogram, f.eks. Word, trykker du på Kursiv-knappen bliver de tre ord inde i den linje, de hele tiden har været på (inline), trykker du på Indsæt tabel splittes hele afsnittet i to, og tabellen med de tre ord indsættes imellem (som en block-level ting !-)

-- og som schwarz84 skriver, så må der kun være een udgave af hvert id ( = unik identifikator, ligesom f.eks. personnumre), mens en klasse, som navnet forsøger at beskrive, er en af en slags, som der sagtens kan være flere af (f.eks. ligesom rødhårede !-)
Avatar billede spaceus Nybegynder
24. april 2006 - 16:00 #9
id'er skal være unikke det skal class's ikke
så hvis du vil ha' flere med samme styling brug klasser
Avatar billede tjakobsen Nybegynder
25. april 2006 - 17:43 #10
Udover at ID'er skal være unikke som spaceus siger, har de også den fordel at de nemt kan tilgås fra fx JavaScript og ASP.NET.
Avatar billede maqhem Nybegynder
25. april 2006 - 20:16 #11
nice!

Nu har jeg prøvet, at udskifte p-et med et a i stedet for, og så virker det faktisk ;D

Såå, smider I lige et svar jokkejensen, schwartz84 og roenving?
Avatar billede roenving Novice
26. april 2006 - 17:17 #12
Velbekomme '-)
Avatar billede jokkejensen Novice
28. april 2006 - 00:01 #13
hehe, prøv lige et <div> i stedet for det a...

:)
Avatar billede jokkejensen Novice
28. april 2006 - 00:02 #14
(og takker)
Avatar billede schwarz84 Nybegynder
01. maj 2006 - 22:12 #15
svar
Avatar billede roenving Novice
05. maj 2006 - 12:47 #16
-- og tak fr point ;~}
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