CSS - Versionsgeschichte

Yehudi am 18. August 2006 um 09:54 Uhr

2006-08-18T09:54:54Z

Yehudi am 18. August 2006 um 09:52 Uhr

2006-08-18T09:52:53Z

Yehudi am 18. August 2006 um 09:48 Uhr

2006-08-18T09:48:21Z

Yehudi am 18. August 2006 um 09:25 Uhr

2006-08-18T09:25:49Z

Yehudi am 18. August 2006 um 09:24 Uhr

2006-08-18T09:24:32Z

Yehudi am 17. August 2006 um 20:18 Uhr

2006-08-17T20:18:02Z

Neue Seite

Dynamische Pseudo-Klassen: :hover

http://www.css4you.de/hover.html

← Nächstältere Version		Version vom 18. August 2006, 09:54 Uhr
Zeile 1:		Zeile 1:
	=== [[Dynamische Pseudo-Klassen]] ===		=== [[Dynamische Pseudo-Klassen]] ===
		+	Hovereffekte, und Linkfarben
		+
		+	[[Category:CMS]]

← Nächstältere Version		Version vom 18. August 2006, 09:52 Uhr
Zeile 1:		Zeile 1:
−	Dynamische Pseudo-Klassen~~: :hover~~	+	=== [[Dynamische Pseudo-Klassen]] ===
−	Häufig herrscht unklarheit darüber, wie die CSS-Teile im CSS angeordnet werden müssen. In meinem Fall hatte ich auf [http://www.yehudi.de/ meiner Website]seit dem ich mit Joomla und CSS arbeite, oft das Problem, dass Links in den Farben auf der ganzen Seite sich gleich verhalten haben.
−	~~Bei mir gibt es mehrere Variationen~~
−	*Mainmenü: Links sind rot, besuchte auch, sobald die Maus rüberfährt sind sie blau, und aktive gelb, der Hintergrund ist Schwarz.
−	*Topmenü: wie Mainmenü, nur der Hintergrund ist grau, und beim rüberfahren und aktiven Link ist es Schwarz.
−	*Contentbereich in der Mitte: alle Variationen der Links sind rot
−	*zum Bericht: das ist in den Inhaltsverzeichnissen z.B. in den [http://www.yehudi.de/news.html News] der Link zum Bericht ist blau, und als hovereffekt unterstrichen.
−	*Grauzone: Das ist der Bereich auf der rechten Seite im grauen Feld unter Yehudi's Shop. Dort ist das gleiche Vehalten wir im mittleren Content bereich, nur das die Schrift kleiner ist.
−
−	Damit diese Dinge auch 100% so angezeigt werden, und nicht anders müssen im Css wie im folgenden Beispiel, die CSS Parts angeordnet werden, sie dürfen von der Reihenfolge nicht gemischt oder verändert werden. Oft sind in den Templates von Joomla diese Angaben nicht korrekt.
−
−	~~/line-height: 2.5; habe ich für den Zeilenabstand eingefügt/~~
−	~~.bericht {~~
−	~~vertical-align: middle;~~
−	~~font-size: 12px;~~
−	~~font-style: italic;~~
−	~~color: #0000FF;~~
−	~~text-align: left;~~
−	~~padding-top: 20px;~~
−	~~padding-left: 0px;~~
−	~~height: 10px !important;~~
−	~~text-decoration: none;~~
−	~~font-family: Verdana, Arial, Helvetica, sans-serif;~~
−	~~line-height: 2.5;~~
−	}
−
−	~~.bericht a:link {~~
−	~~color: #0000FF;~~
−	}
−
−	~~.bericht a:visited {~~
−	~~color: #0000FF;~~
−	}
−
−	~~.bericht a:hover {~~
−	~~color: #0000FF;~~
−	~~text-decoration: underline;~~
−	}
−
−	~~.bericht a:active {~~
−	~~color: #0000FF;~~
−	~~text-decoration: none;~~
−	}
−
−
−	~~--[[Benutzer:Yehudi\|Yehudi~~]] ~~11:24, 18. Aug 2006 (CEST)~~

@@ Zeile 1: / Zeile 1: @@
 Dynamische Pseudo-Klassen: :hover
   /*line-height: 2.5; habe ich für den Zeilenabstand eingefügt*/
@@ Zeile 35: / Zeile 44: @@
 --[[Benutzer:Yehudi|Yehudi]] 11:24, 18. Aug 2006 (CEST)

@@ Zeile 3: / Zeile 3: @@
   /*line-height: 2.5; habe ich für den Zeilenabstand eingefügt*/
   .bericht {
-	vertical-align: middle;
+   vertical-align: middle;
-	font-size: 12px;
+   font-size: 12px;
-	font-style: italic;
+   font-style: italic;
-	color: #0000FF;
+   color: #0000FF;
-	text-align: left;
+   text-align: left;
-	padding-top: 20px;
+   padding-top: 20px;
-	padding-left: 0px;
+   padding-left: 0px;
-	height: 10px !important;
+   height: 10px !important;
-	text-decoration: none;
+   text-decoration: none;
-	font-family: Verdana, Arial, Helvetica, sans-serif;
+   font-family: Verdana, Arial, Helvetica, sans-serif;
-	line-height: 2.5;
+   line-height: 2.5;
+  }

← Nächstältere Version		Version vom 18. August 2006, 09:24 Uhr
Zeile 1:		Zeile 1:
	Dynamische Pseudo-Klassen: :hover		Dynamische Pseudo-Klassen: :hover
		+
		+	/line-height: 2.5; habe ich für den Zeilenabstand eingefügt/
		+	.bericht {
		+	vertical-align: middle;
		+	font-size: 12px;
		+	font-style: italic;
		+	color: #0000FF;
		+	text-align: left;
		+	padding-top: 20px;
		+	padding-left: 0px;
		+	height: 10px !important;
		+	text-decoration: none;
		+	font-family: Verdana, Arial, Helvetica, sans-serif;
		+	line-height: 2.5;
		+	}
		+
		+	.bericht a:link {
		+	color: #0000FF;
		+	}
		+
		+	.bericht a:visited {
		+	color: #0000FF;
		+	}
		+
		+	.bericht a:hover {
		+	color: #0000FF;
		+	text-decoration: underline;
		+	}
		+
		+	.bericht a:active {
		+	color: #0000FF;
		+	text-decoration: none;
		+	}
		+

	http://www.css4you.de/hover.html		http://www.css4you.de/hover.html
		+	--[[Benutzer:Yehudi\|Yehudi]] 11:24, 18. Aug 2006 (CEST)