/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
forskelligfarvede links med div giver uøns~
Fra : Rita Ilsted Smith


Dato : 02-10-06 10:44

Jeg har prøvet at formattere forskellige typer links med div
class, som angivet i flere tidligere indlæg. Jeg skal bruge
'løbende links' altså links inden i en tekst. Der sker så det, at
jeg godt nok for den formattering, jeg vil have, men også et
linjeskift midt i teksten, som jeg ikke vil have. Jeg har prøvet
at bruge span i stedet, som jo er in-line, men jeg kan ikke få
det til at virke.
Hvad kan jeg gøre?

hilsen

Rita Ilsted Smith

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

 
 
Jens Gyldenkærne Cla~ (02-10-2006)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 02-10-06 11:18

Rita Ilsted Smith skrev:

> Jeg har prøvet at formattere forskellige typer links med div
> class, som angivet i flere tidligere indlæg.

Hvilke?


> Jeg skal bruge 'løbende links' altså links inden i en tekst.
> Der sker så det, at jeg godt nok for den formattering, jeg vil
> have, men også et linjeskift midt i teksten, som jeg ikke vil
> have.

Har du et link til din side? Det lyder som om du blander to
teknikker sammen. Links skal bare angives med <a href...> - evt.
tillagt en bestemt klasse. Der hvor en div eller lignende typisk er
i spil ved links, er når man bruger såkaldte kontekstuelle
selektorer. Med den slags kan man fx specificere at alle links
placereret inde i en speciel div, skal have en given formatering.

Eksempel:

HTML:
<div id="menu">
   <a href="x">X</a>
   <a href="y">Y</a>
   <a href="z">Z</a>
</div>

CSS:
#menu a{ color: red; background-color: black; }

Forklaring: Links inde i menuen bliver røde med sort baggrund.
Links uden for menuen påvirkes ikke.



> Jeg har prøvet at bruge span i stedet, som jo er in-line, men jeg
> kan ikke få det til at virke.

Det bedste du kan gøre er at give et link til din side. På den måde
er det meget lettere at hjælpe.
Se evt. <http://infimum.dk/HTML/hjaelpmig.html>
--
Bolig søges. Andel eller leje i Emdrup, Nordvest, Nørrebro, Søborg
eller Brønshøj, max 6000 pr. måned.
Kontakt pr. mail - nospam(at)gyros.dk
Jens Gyldenkærne Clausen

Rita Ilsted Smith (02-10-2006)
Kommentar
Fra : Rita Ilsted Smith


Dato : 02-10-06 14:02

Jens GyldenkærneClausen wrote in dk.edb.internet.webdesign.html:
> Rita Ilsted Smith skrev:
>
> > Jeg har prøvet at formattere forskellige typer links med div
> > class, som angivet i flere tidligere indlæg.
>
> Hvilke?
>
>
> > Jeg skal bruge 'løbende links' altså links inden i en tekst.
> > Der sker så det, at jeg godt nok for den formattering, jeg vil
> > have, men også et linjeskift midt i teksten, som jeg ikke vil
> > have.
> > Har du et link til din side? Det lyder som om du blander to
> teknikker sammen. Links skal bare angives med <a href...> - evt.
> tillagt en bestemt klasse. Der hvor en div eller lignende typisk er
> i spil ved links, er når man bruger såkaldte kontekstuelle
> selektorer. Med den slags kan man fx specificere at alle links
> placereret inde i en speciel div, skal have en given formatering.
>
Min side hedder: www.hoestblomsten.dk
Jeg har lavet en menustruktur og formatteret alle links med den farve
etc., jeg ville have på menupunkterne - det gik fint. Nu skal jeg
imidlertid formattere en anden linkstype, nemlig links inden i den
løbende tekst. De skal bare ligne almindelige links, dvs. være blå
ubesøgte, lilla besøgte og røde ved mouseover.
Jeg kan sådan set godt få det til at virke ved at definere en div
class. Men problemet er så, at linket hopper ned på næste linie i
stedet for at blive i den løbende tekst.
Fx vil jeg gerne, i teksten 'Ved vejen' have lavet links ud af ordene
træerne, tujaer og mahognibregner. Det kan jeg godt gøre, men så er
det, det uønskede linieskift optræder.
hilsen

Rita
> Eksempel:
>
> HTML:
> <div id="menu">
>    <a href="x">X</a>
>    <a href="y">Y</a>
>    <a href="z">Z</a>
> </div>
>
> CSS:
> #menu a{ color: red; background-color: black; }
>
> Forklaring: Links inde i menuen bliver røde med sort baggrund.
> Links uden for menuen påvirkes ikke.
>
>
>
> > Jeg har prøvet at bruge span i stedet, som jo er in-line, men jeg
> > kan ikke få det til at virke.
>
> Det bedste du kan gøre er at give et link til din side. På den måde
> er det meget lettere at hjælpe.
> Se evt. <http://infimum.dk/HTML/hjaelpmig.html>
> --
> Bolig søges. Andel eller leje i Emdrup, Nordvest, Nørrebro, Søborg
> eller Brønshøj, max 6000 pr. måned.
> Kontakt pr. mail - nospam(at)gyros.dk
> Jens Gyldenkærne Clausen


--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Jens Gyldenkærne Cla~ (02-10-2006)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 02-10-06 14:41

Rita Ilsted Smith skrev:

> Min side hedder: www.hoestblomsten.dk

Tak for linket.

> Jeg har lavet en menustruktur og formatteret alle links med
> den farve etc., jeg ville have på menupunkterne - det gik
> fint.

Det er godt at det virker - men du har nogle problemer i koden. Du
ser ud til at være ramt af "div'itis" - altså alt for mange div-
elementer.

Du skal ikke bruge et div-element hver gang du skal lave et link -
bestemt ikke. En div fungerer som en "kasse" der grupperer
forskellige elementer sammen. Selv om det ikke direkte er skadeligt
at anvende mange kasser, er der ikke brug for at anvende så mange
som du har gjort. Din menu ser fx sådan ud:

<div id=".."><div class="menutekst">Gæstebog</div></div>
<div id=".."><div class="menutekst"><a ..>..</a></div></div>
<div id=".."><div class="menutekst"><a ..>..</a></div></div>
<div id=".."><div class="menutekst">Havelinks</div></div>

(punktummerne markerer blot udeladt tekst)

Her har du hvert menupunkt pakket ind i to kasser (en med id, en
med klasse), men du har ikke nogen fælles beholder til dine
menulinks. Du kan gøre strukturen væsentlig lettere at overskue ved
at lægge én kasse uden om alle links, og så ellers have de enkelte
links for sig selv:

<div id="menu">
   <a ..>..</a>
   <a ..>..</a>
   <a ..>..</a>
   <a ..>..</a>
</div>

Hvis der skal være linjeskift og margen mellem de enkelte links,
kan du lægge dem ind i p-elementer:

<div id="menu">
   <p><a ..>..</a></p>
   <p><a ..>..</a></p>
   <p><a ..>..</a></p>
   <p><a ..>..</a></p>
</div>


Det er ikke nødvendigt at definere en klasse på hvert enkelt link -
herover kan du definere farver og evt. understregning med
#menu a{ .. }, og du kan definere margen med #menu p{ .. }.


Når du skal definere links i din løbende tekst, er det letteste nok
bare at bruge en standard-selektor der rammer alle links - fx som
følger:

   a{ color: red; background-color: white; }

Det gør ikke noget at du definerer noget andet end den definition
du har til dine menu-links. De links du har i menuen vil blive
"ramt" af begge definitioner, men da en definition baseret på
klasse eller id vinder over en "rå" definition, vil det være det du
skriver i menu-specifikationen der kommer til at gælde dér. Dog
skal du være opmærksom på at det kun er overlappende egenskaber der
ændres - hvis du fx angiver skrifttypen og farven på alle links med
a{ font-family: verdana, sans-serif; color: blue; } og kun angiver
farven på dine menulinks: #menu a{ color: red; } - vil
skrifttypetildelingen stadig gælde for links i menuen.

Udover de (for) mange div-elementer, har du også nogle konkrete
kodefejl på din side. Du mangler at angive tegnsæt og doctype, og
siden indeholder nogle fejl i html-koden.
På siden <http://www.html-faq.dk/1005.asp> kan du se hvad der skal
være på en html-side og hvordan man får kontrolleret at det er på
plads.
--
Bolig søges. Andel eller leje i Emdrup, Nordvest, Nørrebro, Søborg
eller Brønshøj, max 6000 pr. måned.
Kontakt pr. mail - nospam(at)gyros.dk
Jens Gyldenkærne Clausen

Rita Ilsted Smith (03-10-2006)
Kommentar
Fra : Rita Ilsted Smith


Dato : 03-10-06 13:04

Jens GyldenkærneClausen wrote in dk.edb.internet.webdesign.html:
> Rita Ilsted Smith skrev:
>
> > Min side hedder: www.hoestblomsten.dk
>
> Tak for linket.
>
> > Jeg har lavet en menustruktur og formatteret alle links med
> > den farve etc., jeg ville have på menupunkterne - det gik
> > fint.
>
> Det er godt at det virker - men du har nogle problemer i koden. Du
> ser ud til at være ramt af "div'itis" - altså alt for mange div-
> elementer.
>
> Du skal ikke bruge et div-element hver gang du skal lave et link -
> bestemt ikke. En div fungerer som en "kasse" der grupperer
> forskellige elementer sammen. Selv om det ikke direkte er skadeligt
> at anvende mange kasser, er der ikke brug for at anvende så mange
> som du har gjort. Din menu ser fx sådan ud:
>
> <div id=".."><div class="menutekst">Gæstebog</div></div>
> <div id=".."><div class="menutekst"><a ..>..</a></div></div>
> <div id=".."><div class="menutekst"><a ..>..</a></div></div>
> <div id=".."><div class="menutekst">Havelinks</div></div>
>
> (punktummerne markerer blot udeladt tekst)
>
> Her har du hvert menupunkt pakket ind i to kasser (en med id, en
> med klasse), men du har ikke nogen fælles beholder til dine
> menulinks. Du kan gøre strukturen væsentlig lettere at overskue ved
> at lægge én kasse uden om alle links, og så ellers have de enkelte
> links for sig selv:
>
> <div id="menu">
>    <a ..>..</a>
>    <a ..>..</a>
>    <a ..>..</a>
>    <a ..>..</a>
> </div>
>
> Hvis der skal være linjeskift og margen mellem de enkelte links,
> kan du lægge dem ind i p-elementer:
>
> <div id="menu">
>    <p><a ..>..</a></p>
>    <p><a ..>..</a></p>
>    <p><a ..>..</a></p>
>    <p><a ..>..</a></p>
> </div>
>
>
> Det er ikke nødvendigt at definere en klasse på hvert enkelt link -
> herover kan du definere farver og evt. understregning med
> #menu a{ .. }, og du kan definere margen med #menu p{ .. }.
>
>
> Når du skal definere links i din løbende tekst, er det letteste nok
> bare at bruge en standard-selektor der rammer alle links - fx som
> følger:
>
>    a{ color: red; background-color: white; }
>
> Det gør ikke noget at du definerer noget andet end den definition
> du har til dine menu-links. De links du har i menuen vil blive
> "ramt" af begge definitioner, men da en definition baseret på
> klasse eller id vinder over en "rå" definition, vil det være det du
> skriver i menu-specifikationen der kommer til at gælde dér. Dog
> skal du være opmærksom på at det kun er overlappende egenskaber der
> ændres - hvis du fx angiver skrifttypen og farven på alle links med
> a{ font-family: verdana, sans-serif; color: blue; } og kun angiver
> farven på dine menulinks: #menu a{ color: red; } - vil
> skrifttypetildelingen stadig gælde for links i menuen.
>
> Udover de (for) mange div-elementer, har du også nogle konkrete
> kodefejl på din side. Du mangler at angive tegnsæt og doctype, og
> siden indeholder nogle fejl i html-koden.
> På siden <http://www.html-faq.dk/1005.asp> kan du se hvad der skal
> være på en html-side og hvordan man får kontrolleret at det er på
> plads.
> Tusind tak for din udførlige vejledning - jeg vil prøve at følge
den. Jeg er begynder i programmering i html/css, så jeg har ikke
hidtil lagt særlig vægt på validering. Men det vil jeg gøre fremover!

hilsen

Rita
> Bolig søges. Andel eller leje i Emdrup, Nordvest, Nørrebro, Søborg
> eller Brønshøj, max 6000 pr. måned.
> Kontakt pr. mail - nospam(at)gyros.dk
> Jens Gyldenkærne Clausen


--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Jens Gyldenkærne Cla~ (03-10-2006)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 03-10-06 13:27

Rita Ilsted Smith skrev:

> Tusind tak for din udførlige vejledning - jeg vil prøve at
> følge den.

Velbekomme. Hvis du får problemer undervejs, må du bare skrive
igen.


> Jeg er begynder i programmering i html/css, så jeg
> har ikke hidtil lagt særlig vægt på validering. Men det vil
> jeg gøre fremover!

Godt at høre. Det kan godt virke lidt overvældende når man
begynder, men når man først får vænnet sig til at kontrollere koden
er det ikke så svært endda.

PS: Det er lettere at læse dine kommentarer hvis du nøjes med at
citere kortere blokke af det foregående indlæg. Se evt. siden her:
<http://www.html.dk/nyhedsgrupper/usenet.asp>. Derudover er det
rart med en tom linje mellem citatet og den nye tekst - ellers
flyder det let sammen.
--
Bolig søges. Andel eller leje i Emdrup, Nordvest, Nørrebro, Søborg
eller Brønshøj, max 6000 pr. måned.
Kontakt pr. mail - nospam(at)gyros.dk
Jens Gyldenkærne Clausen

Jørgen Farum Jensen (02-10-2006)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 02-10-06 13:14

Rita Ilsted Smith skrev:
> Jeg har prøvet at formattere forskellige typer links med div
> class, som angivet i flere tidligere indlæg. Jeg skal bruge
> 'løbende links' altså links inden i en tekst. Der sker så det, at
> jeg godt nok for den formattering, jeg vil have, men også et
> linjeskift midt i teksten, som jeg ikke vil have. Jeg har prøvet
> at bruge span i stedet, som jo er in-line, men jeg kan ikke få
> det til at virke.
> Hvad kan jeg gøre?

div#indhold a {white-space:nowrap;}?

--

Med venlig hilsen

Jørgen Farum Jensen
http://www.webdesign101.dk
..

Rita Ilsted Smith (02-10-2006)
Kommentar
Fra : Rita Ilsted Smith


Dato : 02-10-06 14:07

Jørgen Farum Jensen wrote in dk.edb.internet.webdesign.html:
> Rita Ilsted Smith skrev:
> > Jeg har prøvet at formattere forskellige typer links med div
> > class, som angivet i flere tidligere indlæg. Jeg skal bruge
> > 'løbende links' altså links inden i en tekst. Der sker så det, at
> > jeg godt nok for den formattering, jeg vil have, men også et
> > linjeskift midt i teksten, som jeg ikke vil have. Jeg har prøvet
> > at bruge span i stedet, som jo er in-line, men jeg kan ikke få
> > det til at virke.
> > Hvad kan jeg gøre?
>
> div#indhold a {white-space:nowrap;}?
> Jeg forstår din kode sådan, at man dermed ophæver blok-effekten af
div-definitionen, og det lyder jo, som det jeg gerne vil.
Men jeg ved ikke helt, hvor jeg skal anbringe koden - skal det være
foran alle linksdefinitioner, altså:
div #indhold a:visited {white-space:nowrap; color:blue .....(etc)}

hilsen

Rita
> --
>
> Med venlig hilsen
>
> Jørgen Farum Jensen
> http://www.webdesign101.dk
> ..


--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Jørgen Farum Jensen (02-10-2006)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 02-10-06 15:31

Rita Ilsted Smith skrev:

>> div#indhold a {white-space:nowrap;}?
>> Jeg forstår din kode sådan, at man dermed ophæver blok-effekten af
> div-definitionen, og det lyder jo, som det jeg gerne vil.
> Men jeg ved ikke helt, hvor jeg skal anbringe koden - skal det være
> foran alle linksdefinitioner, altså:
> div #indhold a:visited {white-space:nowrap; color:blue .....(etc)}
>

Jeg forstod på dit spørgsmål, at problemet var,
at du havde nogle omløbende links i din indholds-
tekst, som du ikke ønskede brød om samme med linien,
for eksempel:

Dette er
en linktekst

Mit forslag var at du gave alle a-markører (links)
inde i en div med id="indhold" white-space egenskaben
nowrap.
Min kode hører hjemme i stylesheetet for siden og
forudsætter at din tekst er inde i en div med den
nævnte id.

--

Med venlig hilsen

Jørgen Farum Jensen
http://www.webdesign101.dk
..

Rita Ilsted Smith (03-10-2006)
Kommentar
Fra : Rita Ilsted Smith


Dato : 03-10-06 13:06

Jørgen Farum Jensen wrote in dk.edb.internet.webdesign.html:
> Rita Ilsted Smith skrev:
>
> >> div#indhold a {white-space:nowrap;}?
> >> Jeg forstår din kode sådan, at man dermed ophæver blok-effekten af
> > div-definitionen, og det lyder jo, som det jeg gerne vil.
> > Men jeg ved ikke helt, hvor jeg skal anbringe koden - skal det være
> > foran alle linksdefinitioner, altså:
> > div #indhold a:visited {white-space:nowrap; color:blue .....(etc)}
> >
>
> Jeg forstod på dit spørgsmål, at problemet var,
> at du havde nogle omløbende links i din indholds-
> tekst, som du ikke ønskede brød om samme med linien,
> for eksempel:
>
> Dette er
> en linktekst
>
> Mit forslag var at du gave alle a-markører (links)
> inde i en div med id="indhold" white-space egenskaben
> nowrap.
> Min kode hører hjemme i stylesheetet for siden og
> forudsætter at din tekst er inde i en div med den
> nævnte id.
> mange tak for tippet.
hilsen

Rita
> --
>
> Med venlig hilsen
>
> Jørgen Farum Jensen
> http://www.webdesign101.dk
> ..


--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Søg
Reklame
Statistik
Spørgsmål : 177501
Tips : 31968
Nyheder : 719565
Indlæg : 6408527
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste