Avatar billede niklas1 Nybegynder
23. oktober 2009 - 20:03 Der er 12 kommentarer og
1 løsning

CSS STYLING!!

Hej.
Jeg har ikke leget med PHP meget længe, eller generelt kode.

Jeg sidder her med noget kode, hvor jeg har lavet et style på min link-tekst.

men, jeg vil gerne have flere forskellige link-styles.

da min menu styling, ikke skal være den samme som min styling i min content tekst.

Men jeg syntes simpelthen ikke jeg kan få det til at virke.

mit style ser sådan ud:


/*CLASS */

.menulink
{
font-family: verdana;
font-Size: 12px;
color: black;
text-decoration: none;
}

.sidelink
{
font-family: verdana;
font-size: 12px;
color: white;
font-weight: bold;
}

.center
{
text-align: center;
}

a:link {color: #51130e; text-decoration: none;} /* ikke besøgt link */
a:visited {color: #51130e; text-decoration: none;} /* besøgt link */
a:hover {color: #823d37; text-decoration: none;} /* mouse over link */
a:active {color: #823d37; font-weight:bold} /* valgt link */




- men når jeg bruger links i min content tekst, f.eks min forside tekst skriver jeg følgende i min kode:

<a class="sidelink" href="http://link.dk" target="_blank"> Klik her</a><br>


- nogle der kan forklare hvorfor den IKKE styler mit link i content?

Mvh.
Niklas
Avatar billede Slettet bruger
23. oktober 2009 - 20:17 #1
Den letteste måde at gøre det på:

.menu a {
Links i menu
}

.side a {
Links i side
}
Avatar billede niklas1 Nybegynder
23. oktober 2009 - 20:21 #2
altså:

.menu a {
font-family: verdana;
font-Size: 12px;
color: black;
text-decoration: none;
}

.menu a:link {color: #51130e; text-decoration: none;}
.menu a:visited {color: #51130e; text-decoration: none;}
.menu a:hover {color: #823d37; text-decoration: none;}
.menu a:active {color: #823d37; font-weight:bold}

.side a{font-family: verdana;
font-Size: 12px;
color: black;
text-decoration: none;
}
.side a:link {color: #51130e; text-decoration: none;}
.side a:visited {color: #51130e; text-decoration: none;}
.side a:hover {color: #823d37; text-decoration: none;}
.side a:active {color: #823d37; font-weight:bold}




??
Avatar billede Slettet bruger
23. oktober 2009 - 20:26 #3
.side a:link {color: #51130e; text-decoration: none;}
.side a:visited {color: #51130e; text-decoration: none;}

kan splejses til:

.side a:link, .side a:visited {color: #51130e; text-decoration: none;}

men ellers er det rigtigt nok.
Avatar billede niklas1 Nybegynder
23. oktober 2009 - 20:31 #4
jeg syntes ikke rigtig jeg kan få det til at fungere :/
det gider ikke helt som jeg vil.
Avatar billede niklas1 Nybegynder
23. oktober 2009 - 20:48 #5
bruger nu dette, og det virker ikke:
.menulink
{
font-family: verdana;
font-Size: 12px;
color: black;
}

.menulink a:link {
color: #51130e;
text-decoration: none;
}

.menulink a:visited {
color: #51130e;
text-decoration: none;
}

.menulink a:hover {
color: #823d37;
font-weight: bold;
}

.menulink a:active {
color: #823d37;
font-weight:bold;
}
Avatar billede wanze Nybegynder
23. oktober 2009 - 23:43 #6
Du mangler et "a" efter ".menulink". Derudover kan du blot omskrive det hele til:

menulink a {
font: 12px verdana, sans-serif;
color: black;
color: #51130e;
text-decoration: none;
}
.menulink a:hover,
.menulink a:active {
color: #823d37;
font-weight: bold;
}

Jeg har samtidig lige tilføjet sans-serif efter din font, så den vil vælge Arial eller en anden font uden seriffer, hvis Verdana ikke ligger på den computer, der forsøger at vise siden.
Avatar billede wanze Nybegynder
23. oktober 2009 - 23:45 #7
OK, jeg har vist lavet en lille fejl. Jeg går ud fra, at det er dine links, der skal være #51130e og andet tekst skal være sort. I så fald skal du lige tilføje:

.menulink {
color: black;
}

også. Desuden glemte jeg et punktum før menulink. :)
Avatar billede Slettet bruger
24. oktober 2009 - 14:38 #8
Desuden glemte du at overholde de uskrevne regler her på eksperten, om at man starter med at lægge en kommentar, og først lægger et svar når løsningen er fundet :)

Kan du ikke give et link til siden?
Så er det meget lettere at fikse.
Avatar billede niklas1 Nybegynder
25. oktober 2009 - 14:09 #9
jeg syntes stadig det driller utrolig meget.

www.supersweetsixteen.dk/lala
Avatar billede wanze Nybegynder
25. oktober 2009 - 14:22 #10
Ahh. Ja, du har misforstået CSS'en.

.menulink a
Den kode vil have effekt på fx
<div class="menulink"><a href="/">blah</a></div>

Men du skriver istedet <a class="menulink" href="/">blah</a>.

Hvis du ønsker at påvirke lige netop denne linje skal du bruge:
a.menulink
Det er der dog ingen grund til, da alle linksne i din menu alligevel ligger i <div id="menu">, hvorfor du bare kan flytte alt der står i .menulink a over under #menu a.
Avatar billede niklas1 Nybegynder
25. oktober 2009 - 14:29 #11
Wanze - kan jeg ikke få din mail, og sende min CSS kode til dig.
for jeg forstår det ærlig talt ikke.
Jeg håber du vil rette det til, for så tror jeg selv jeg vil få en nemmere forståelse af det.
Avatar billede wanze Nybegynder
25. oktober 2009 - 14:56 #12
Jeg synes da ellers det ser meget rigtigt ud på siden nu.
Avatar billede niklas1 Nybegynder
25. oktober 2009 - 17:03 #13
Hej Wanze :)

Ja det lykkedes mig sørme at få det til at virke.

Kender du nogen muligheder til at få de billeder i højre side, til at være forskellige?
sådan at det skifter når siden reloades..
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