Suchen Sie nach Vorschlägen, um Schrift mit einem Schlagschatten besser lesbar zu machen

Ich möchte ein Menü mit eingerückten Elementen auf einem schwarzen Hintergrund anzeigen . Ich habe viele Farben ausprobiert, aber ich finde nicht die richtigen.

Ich verwende CSS- Eigenschaft text-shadow:

text-shadow: 1px 1px #191919 , -1px -1px #444;

Hier ein Screenshot zum besseren Verständnis:

Geben Sie hier die Bildbeschreibung ein

Ich bin nicht zufrieden und ich bin mir ziemlich sicher, dass es etwas Besseres gibt ... Irgendwelche Vorschläge bitte?

Es gibt keine „beste“ Farbe. Wenn Sie fragen, was zu tun ist, um den weißen Text besser lesbar zu machen, wäre die Antwort, ihn nicht über einem Foto zu platzieren. Aber wenn Sie das möchten, bleiben Sie bei nur einem Schlagschatten und wählen Sie eine schwarze Farbe mit einer weichen Unschärfe, um am besten ein wenig Kontrast hinzuzufügen. Die aktuellen Double-Hard-Line-Schatten sind viel zu störend.
Es hilft überhaupt nicht, dass Sie weißen Text über ein Schwarzweißbild setzen, das zufällig einen ziemlich hellen Hintergrund hat, wo der Text sitzt. Ich würde wahrscheinlich am Ende einen schwarzen Hintergrund in das Menü einfügen: jsfiddle.net/lollero/qxyNC/1/show (Der Code selbst ist keine Empfehlung, nur der visuelle Stil davon.)

Antworten (2)

Wenn Sie vier statt zwei Schatten verwenden, erhalten Sie möglicherweise eine bessere Annäherung an einen Umrisseffekt, wenn Sie dies möchten:

text-shadow: 0 -1px #000, 1px 0 #000, 0 1px #000, -1px 0 #000;

Etwas überraschend stellt sich heraus, dass das W3C diesen Hack in seinen CSS-Beispielen tatsächlich empfiehlt .

Der Schatten sieht eher wie ein unterbrochener Strich aus und stört die Buchstabenformen. Ich würde wahrscheinlich einen weicheren Schatten mit mehr Streuung wählen oder eine Band wie die, die Lollero in einem Kommentar erwähnt hat.

@Mooh ..Oder eine Möglichkeit könnte darin bestehen, Bilder anstelle von Text zu verwenden. Auf diese Weise können Sie dem "Text" auch die richtigen Striche und die richtigen Schatten hinzufügen. Das funktioniert allerdings nur bei sehr statischen Website-Menüs und ist selbst dann nicht sehr praktisch.
Suchen Sie nach Vorschlägen, um Schrift mit einem Schlagschatten besser lesbar zu machen
AntwortenHierDatenschutz-Bestimmungen1y, 0v