In diesem Zusammenhang finde ich zwei andere Fragen interessant:
Ich hänge noch eine an: Was haltet ihr von folgender Konstruktion ...
<h1 id="top">Foo</h1>
Der ID bezeichner missfällt mir.
Wie wärs mit "local-content" ?
<ul>
<li><a href="#abschnitt_bar">Bar</a></li>
<li><a href="#abschnitt_baz">Baz</a></li>
</ul>
<h2 id="abschnitt_bar">Bar</h2>
<p><a href="#top">zur Übersicht</a></p>
Ist hier alles von der Gestaltung abhängig, und ein Seitenlokaler stereotyper Link ist meiner Meinung nach keines <p> würdig.
Auch behagt mir der Platz an dieser Stelle nicht. Ich bevorzuge es am Ende eines Abschnitts, oder zumindest vor dem <hx> Element.
<p>Lorem ipsum dolor sit amet</p>
>
> ... in Kombination mit folgendem CSS?
>
> ~~~css
h2 + p { visibility: hidden; }
> h2:target + p { visibility: visible; }
Du nutzt gezielt visibility statt display:none, und setzt damit eine Funktionalität, die visuell orientierte User betrifft.
Ich würde eine Klasse verwenden, statt nur das Element als Sibling selektieren (kann schief gehen).
target sollte man nur dort zum ein-und ausblenden nutzen, wo du garantiert nur eine Instanz von mehreren Alternativen anzeigen lassen willst.
Ein mit target geöffneter Bereich muss auch wieder ein "schliessen" Element aufweisen. Man kann es nur verschwinden lassen, indem man einen Link betätigt. target braucht keine Energie, um ein Element angezeigt zu lassen (im Gegensatz zu hover). Es braucht aber Energie, um es verschwinden zu lassen. Das sollte man sich zweimal überlegen.
Praktisch verwende ich :target bei Details, die einen grösseren Platz einnehmen, so dass man eventuell scrollen muss, und die somit den normalen text verdecken. Sie bekommen dann eben als "target-popups" ihren "Schliessen" Link.
mfg Beat
><o(((°> ><o(((°>
<°)))o>< ><o(((°>o