Die Tips sind nicht sortiert, ich hab sie so runtergeschrieben, wie sie mir eingefallen sind. Das könnte sich ändern, falls noch viele dazukommen.
Der letzte Trenner wird im IE nicht korrekt dargestellt, da sollte man dann auf ein DIV ausweichen ...
Ein Regenbogen aus HRs ...
Das größte Problem ist, eine Text-Alternative zu schaffen, die angezeigt wird, wenn die Image-Anzeige abgeschaltet ist. Hier lösen wir dies, indem wir zwei spans in das h3 setzen. Das eine enthält das Image als Hintergrundgrafik, das andere den Text. Beide werden als block-Elemente deklariert und per z-index in die richtige Reihenfolge gebracht.
Hauptmenü
Link 1 |
Link 2 |
Link 3
Erscheint im Textbrowser/Sreenreader so:
So lassen sich alle möglichen Buttons und Illustrationen verlinken, obwohl sie als Hintergrund-Grafik(en) referenziert sind (um in der 'Nur_Text_Ansicht' unsichtbar zu bleiben).
Dies ist ein HTML-Text, in dem das Akronym HTML mehrfach auftaucht, aber der Begriff HTML nicht mehrfach erklärt werden soll.
Der Begriff Hyperlinks - (klickbare Verweise auf andere Webseiten) soll hier mit einem kurzen 'Tooltip' erläutert werden.
Normalerweise kann man das prima mit :first-letter formatieren.
Das bringt jedoch den IE zum Absturz, also muß man einen Kind-Selektor (html>body) nutzen, den IE nicht versteht.
Alternativ kann man das mühsam händisch mit span machen (was Blödsinn ist), oder drauf verzichten.
It's your choice.
Klar abgegrenzte Kästchen (sog. "Teaser") sind ein beliebtes Element für Navigations-Elemente oder auch für kleine Werbeblöcke.
Hier ein verspielter Button mit 'Hover-Effekt'.
Skaliert bis der Arzt kommt ;o)
xxx