[CSS] Die wichtigsten Linkeffekte

anna.

Zitat:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>Menue</title>
<style type="text/css">

</style>
<style type="text/css">
A:link {COLOR: #000000; TEXT-DECORATION: none; border:1 dotted; border-color:#000000;}
</style>
</head>
<body style="background-color: rgb(230, 221, 203);">
<div style="text-align: center; font-family: Verdana;">
<small><a style="color: rgb(0, 0, 0);" href="Home1.html"
target="untermenue"> Home</a><br>
<a style="color: rgb(0, 0, 0);" href="About1.html"
target="untermenue"> About</a><br>
<a style="color: rgb(0, 0, 0);" href="Aktuelles1.html"
target="untermenue"> Aktuelles</a><br>
<a style="color: rgb(0, 0, 0);" href="Bilder1.html"
target="untermenue"> Bilder</a><br>
<a style="color: rgb(0, 0, 0);" href="Videos1.html"
target="untermenue"> Videos</a></small>
<big><big><small><br>
  </small></big></big></div>
</body>
</html>

das stimmt nicht.^^

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>Menue</title>
<style type="text/css">
<!--
BODY {
scrollbar-face-color: #D4E6EA;
scrollbar-highlight-color: #D4E6EA;
scrollbar-3dlight-color: #D4E6EA;
scrollbar-darkshadow-color: #D4E6EA;
scrollbar-shadow-color: #D4E6EA;
scrollbar-arrow-color: #000000;
scrollbar-track-color: #D4E6EA;
}

A:link {COLOR: #000000; TEXT-DECORATION: none; border:1 dotted; border-color:#000000;}
-->
</style>
</head>
<body style="background-color: rgb(230, 221, 203);">
<div style="text-align: center; font-family: Verdana;">
<small><a style="color: rgb(0, 0, 0);" href="Home1.html"
target="untermenue"> Home</a><br>
<a style="color: rgb(0, 0, 0);" href="About1.html"
target="untermenue"> About</a><br>
<a style="color: rgb(0, 0, 0);" href="Aktuelles1.html"
target="untermenue"> Aktuelles</a><br>
<a style="color: rgb(0, 0, 0);" href="Bilder1.html"
target="untermenue"> Bilder</a><br>
<a style="color: rgb(0, 0, 0);" href="Videos1.html"
target="untermenue"> Videos</a></small>
<big><big><small><br>
&nbsp;&nbsp;</small></big></big></div>
</body>
</html>

Supergirl

hab mal eine frage: wie kann ich es einstellen, dass ein bestimmtes Wort durchgestrichen erscheint? möchte das so in die Navigation stehen, damit man sieht, dass diese Seite immoment nicht aufgerufen werden kann!

Alex96

hey geil.. werde ich demnächst ausprobieren *mega geil Augenzwinkern

Nanni

Zitat:

Original von Supergirl
hab mal eine frage: wie kann ich es einstellen, dass ein bestimmtes Wort durchgestrichen erscheint? möchte das so in die Navigation stehen, damit man sieht, dass diese Seite immoment nicht aufgerufen werden kann!

KinoKarte

Mein Code sieht jetzt so aus:

code:

1:
2:
3:
4:
5:
6:
7:

<style type="text/css">
A:link { color: #3F362E; font-size: 9pt; font-style: normal; text-decoration: none; }
A:visited { color: #3F362E; font-size: 9pt; font-style: normal; text-decoration: none; }
A:hover { color: #3F362E; font-size: 9pt; font-style: normal; text-decoration: none; }
A:active { color: #3F362E; font-size: 9pt; font-style: normal; text-decoration: none; }
</style>

Er funktioniert, aber die normalen Links werden immernoch blau angezeigt und die Anderen haben nicht die gewünschte Schriftgröße...

Nanni

uh. Was ist bitte ein normaler Link?
Du kannst die erste und letzte Zeile weglassen (bei mir wurden vorher die Scrollbalken nicht richtig angezeigt, ohne dem <style...> ging es dann.

Jamaika

code:

1:
2:
3:
4:
5:
6:
7:

<style type="text/css"> 
<!-- a:link {color:#000000; text-decoration:none} 
a:visited {color:#000000; text-decoration:none} 
a:active {color:#000000; text-decoration:none} 
a:hover {color:#000000; text-decoration:border-bottom:1dotted#000000;
--> 
</style>

Kann mir jemand sagen, was daran falsch ist? Liegt es möglicherweise am Firefox?

Morgan Girl

1. firefox
und
2. leerzeichen Augenzwinkern

so ists richtig:

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:

<style type="text/css"> 
<!-- a:link {color:#000000; text-decoration:none} 
a:visited {color:#000000; text-decoration:none} 
a:active {color:#000000; text-decoration:none} 
a:hover {color:#000000; text-decoration:border-bottom:1 dotted #000000;
--> 
</style>

Jamaika

Dankeschön! fröhlich

Nasha

Zitat:

Original von sultanfriend
ich hab auf den seiten, wo links sind (sprich im meü xD) immer

<STYLE type="text/css">
A:link{COLOR: #000000; TEXT-DECORATION: none; }
A:visited{COLOR: #000000; TEXT-DECORATION: none; }
A:active{COLOR: #000000; TEXT-DECORATION: none; }
A:hover{COLOR: #FF0000; TEXT-DECORATION: none; }
</STYLE>

zwischen <head> und </head> eingegeben und dann jeweils die effekte eingesetzt. hat geklappt fröhlich

edit: also, auf jede seite einzeln eingefügt ganz oben xD

wie sag ich das jz am besten....
DANKE,DANKE,DANKE,DANKE,DANKE xD.

Dilara

code:

1:

<style type="text/css">  <!-- a:link {color:#000000; text-decoration:none}  a:visited {color:#000000; text-decoration:none}  a:active {color:#000000; text-decoration:none}  a:hover {color:#000000; text-decoration:border-bottom:1 dotted #000000; -->  </style>

kann man diesen Code nicht einmal i-wo einfügen und dann funktioniert er auf der ganzen seite ?

Dilara

stimmt... aber wie mach ich den ?

+Debbie+

du packst die CSS Angaben in eine Datei und nennst sie z.B. style.css
Auf jeder HTML seite fügst du jetzt in den Head-Bereich folgendes ein:

code:
1:	<link rel="stylesheet" type="text/css" href="style.css">

funktioniert dann auf der ganzen Seite Augenzwinkern

Nyuraa_

Tut mir Leid für's hochholen.
Aber was ist, wenn ich meine Links immer großgeschrieben haben möchte & sie beim draufgehen nur farbig werden?
Geht das? Das geht sicher. Hoffentlich kann mir jemand helfen großes Grinsen

MissMiralda

Na klar geht das großes Grinsen

Du definierst einfach nicht nur A:link, sondern auch A:active (wenn du grad auf der Seite drauf bist, eben aktiv), A:visited (die Seiten, die du schon besucht hast, past tense von visit) und A:hover (da wo du grad drüberfährst)
Du sagst dann einfach, dass bei allen Sachen das immer großgeschrieben werden soll und dass halt beim drüberfahren (A:hover) farbig sein soll. smile

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:

A:hover, A:active, A:visited {
...
text-decoration:none; text-transform:uppercase;
...
}

A:hover {
...
text-decoration:none; text-transform:uppercase;
color: #000000;
...
}

Und das packst du dann entweder in deinen externen Stylesheet oder zB bei Oyla im Designcode unter <style> smile

Dann musst dus ja nich immer bei jedem Link definieren, sondern einfach nur den Link als Link definieren und den Rest macht eben der Style. xD

... War das verständlich? großes Grinsen

*schlecht erklären kann*

Nyuraa_

Und und und bei Wbblite, im ACP und so? :3

MissMiralda

Oh xDDD Ja da gehts ungefähr gleich. XD
Ja, da gehst du ins ACP und in das jeweilige Designpack und fügst es im CSS Code einfach ein. ^^ Is wie ein externer Stylesheet. smile

Also ohne <style>.

EDIT.
Ne gar nich wahr. xDD
Warte mal... ich schau mal nach. ^^

EDIT².
Also da hab ich (hab den Code teilweise von dem Tut übernommen) bg, tablea, tableb, tablecat und tabletitle definiert. ^^

Ungefähr so ...

code:
1: 2: 3: 4: 5: 6: 7:	#bg A:link, #bg A:visited, #bg A:active { ... } #bg A:hover { ... } #tablea A:link, #tablea A:visited, #tablea A:active { ... } #tablea A:hover { ... } usw.

Nyuraa_

Irgendwie klappt das nich :/
DAs sieht jetzt bei mir so aus:

#bg A:link, #bg A:visited, #bg A:active { COLOR: #FFFFFF; TEXT-DECORATION: uppercase; }
#bg A:hover { COLOR: #B26C2E; TEXT-DECORATION: none; }

#tablea A:link, #tablea A:visited, #tablea A:active { COLOR: #FFFFFF; TEXT-DECORATION: uppercase; }
#tablea A:hover { COLOR: #B26C2E; TEXT-DECORATION: none; }

#tableb A:link, #tableb A:visited, #tableb A:active { COLOR: #FFFFFF; TEXT-DECORATION: uppercase; }
#tableb A:hover { COLOR: #B26C2E; TEXT-DECORATION: none; }

#tablecat A:link, #tablecat A:visited, #tablecat A:active { COLOR: #FFFFFF; TEXT-DECORATION: uppercase; }
#tablecat A:hover { COLOR: #B26C2E; TEXT-DECORATION: none; }

#tabletitle A:link, #tabletitle A:visited, #tabletitle A:active { COLOR: #FFFFFF; TEXT-DECORATION: uppercase; }
#tabletitle A:hover { COLOR: #B26C2E; TEXT-DECORATION: none; }

aaaber meine Links sehen so aus, dass sie unterstrichen sind. das unterstrichene geht weg, wenn ich drauf geh. Und es kommt kein Uppercase wenn ich drauf geh. Farbig werden sie schon.

MissMiralda

Ich würd mal bei jeder Definition alles gleichsetzen, also bei #gb und #tablecat und so weiter immer das gleich definieren, und dann schauen, welche Definition wohin gehört. smile

Ich habs auch durch ausprobieren herausgefunden, kann es dir nich genau sagen, habe mit Wbblite erst seit kurzem zu tun. smile

Nyuraa_

Also.. irgendwie will es bei mir nicht klappen. Diese komplizierten Sachen hassen mich großes Grinsen

Oben hab ich editiert, jetzt müsste doch eigentlich alles gehn :/ Tut es aber nicht.

vorherige Seite

nächste Seite

Forensoftware: Burning Board, entwickelt von WoltLab GmbH