Ich habe eine Navigationsleiste mit Registerkarten, in der die geöffnete Registerkarte einen Schatten haben soll, um sie von den anderen Registerkarten abzuheben. Ich möchte auch, dass im gesamten Registerkartenbereich ein einzelner Schatten (siehe untere horizontale Linie) nach oben zeigt, der die Unterseite aller Registerkarten mit Ausnahme der offenen schattiert.
Ich werde die CSS3- box-shadow
Eigenschaft verwenden, um dies zu tun, aber ich kann keinen Weg finden, nur die Teile zu schattieren, die ich möchte.
Normalerweise würde ich den unteren Schatten der geöffneten Registerkarte mit dem Inhaltsbereich (höher z-index
) verdecken , aber in diesem Fall hat der Inhaltsbereich selbst einen Schatten, sodass er nur die Registerkarte abdeckt.
Registerkartenlayout
_______ _______ _______ | | | | | | ____ | _______ | __ | | __ | _______ | ______
Schattenlinie.
Der Schatten würde von den horizontalen Linien nach außen und von den vertikalen Linien nach außen gehen.
_______ | | _______________ | | _________________
Hier ist ein Live-Beispiel:
Hilfe da draußen, Genies?