Avatar billede webcreator Nybegynder
22. november 2004 - 18:36 Der er 10 kommentarer og
1 løsning

Indsætte specielt tegn foran tekst når class bruges

Hej Eksperter.

Jeg skriver følgende :

<div class="headline">Overskrift</div>

Er det muligt at ovenstående kommer ud på flg. måde :

>> Overskrift

Bemærk at pilene skal være med rød, font-size 9px. Teksten skal være fed og i font-size 11px.

Kan alt dette laves på en og samme class ?
Avatar billede exp Juniormester
22. november 2004 - 18:38 #1
Det kan sagtens laves, men du skal bare være opmærksom på, at det ikke virker i IE
Avatar billede webcreator Nybegynder
22. november 2004 - 18:42 #2
Nå - så duer det ikke. Øvs øvs.

Jeg kan også sagtens lave en ekstra klasse. Men det er pænt irriterende at jeg hele tiden skal tilføje 'float: left' hvis jeg vil have tekst på den anden side af '>>'-tegnene. Kan det løses ?
Avatar billede exp Juniormester
22. november 2004 - 18:42 #3
HTML:
<p class="overskrift">Lim Chee Aun</p>

CSS
.arrow{
color: red;
font-size: 9px;
}
.overskrift{
font-weight: bold;
font-size: 11px;
}
.overskrift:before{
content:before "<span class='arrow'> >> ";
}
Avatar billede exp Juniormester
22. november 2004 - 18:44 #4
Hov:
.overskrift:before{
content:before "<span class='arrow'> >> </span>";
}


Ellers:
<span class="arrow"> >> </span><span class="overskrift">Overskrift</span>
Avatar billede webcreator Nybegynder
22. november 2004 - 18:49 #5
Den vil virke i IE ?
Avatar billede webcreator Nybegynder
22. november 2004 - 18:49 #6
Oh, <span> tvinger altså ikke et linieskift igennem ?
Avatar billede exp Juniormester
22. november 2004 - 19:10 #7
Span er et inline-element:
<span>Dette</span><span>står</span><span>på</span><span>samme</span><span>linie</span>

Div er et block-element:
<div>Dette</div><div>står</div><div>på</div><div>hver</div><div>sin</div><div>linie</div>

Span kan godt laves til et block-element:
span {
display: block;
}

ligesom div kan gøres til et inline-element:
div {
display: inline;
}
Avatar billede exp Juniormester
22. november 2004 - 19:12 #8
.overskrift:before vil ikke virke i IE - den anden burde :-)
Avatar billede webcreator Nybegynder
22. november 2004 - 19:23 #9
Tusind tak, Exp. Det er du hård til ;)
Svar ? :)
Avatar billede exp Juniormester
22. november 2004 - 19:33 #10
Hehe - hvis du har fx Firefox, kan du kigge lidt på denne side:
www.phoenity.com/newtedge/hide_email_spambots
Avatar billede webcreator Nybegynder
22. november 2004 - 20:16 #11
Cool. Takker :)
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