Anfängerfrage: Hintergrundfarbe von Text

  • Hallo beisammen,


    ich will weißen und fett formatierten Text mit einer schwarzen Hintergrundfarbe darstellen, allerdings soll sie rings um die einzelnen Schriftzeichen ein paar Pixel größer zu sehen sein. Dagegen sollen die Abstände zwischen den Zeichen diese Formatierung nicht aufweisen.

    html-seminar.de/woltlab/attachment/1579/

    padding, border, letter-spacing habe ich schon ausprobiert: leider ohne Erfolg. Ist vermutlich simpel, aber ich komme einfach nicht drauf.


    Gruß, Andreas

  • Entweder eine entsprechende Schriftart verwenden oder halt jeden Buchstaben in einen <span> setzen und entsprechend mit CSS formatieren.

    Würde auch mit JavaScript funktionieren, aber das halte ich beides für ziemlich overloaded für den Zweck.

  • Und schon wird das wieder blind übernommen... Nutze Tags dafür, die dazu gedacht sind!

    Du verwendest sicher auch <p>-Tags für normale Absätze, dann musst Du die über Klassen unterscheiden können, damit das klappt.


    Unnötiger Aufwand, der mit Verwendung des richtigen Tags nicht entsteht!


    Btw. würde ich eher die Javascript-Variante nehmen. Dann brauchst Du auch nicht jeden Buchstaben einzeln in Tags setzen:

    https://codepen.io/anon/pen/MXoGZy

  • Was spricht dagegen ein <p> eine feste Breite zu geben ? Oder sollte man das über das Elternelement machen wenn <p> nicht länger als 100px haben darf?

    Btw. würde ich eher die Javascript-Variante nehmen. Dann brauchst Du auch nicht jeden Buchstaben einzeln in Tags setzen:

    https://codepen.io/anon/pen/MXoGZy

    Bei 3 Buchstaben könnte man das schon machen.Bei längeren Worten/Sätze ist die Js Variante schon Vorteilhafter

  • dann halt ohne inline-block

    display:flex macht es nicht besser und ist an der Stelle auch Zweck entfremdet.

    Was spricht dagegen ein <p> eine feste Breite zu geben ?

    Bezogen auf diesen Anwendungsfall spricht dagegen, dass es Tags gibt, die bereits das Verhalten per default besitzen, das Du dem <p> aufzwingen willst. Das tut einfach nicht nötig und sollte auch nicht so an "lernende" vermittelt werden!

    Oder sollte man das über das Elternelement machen wenn <p> nicht länger als 100px haben darf?

    Über die parent node ist immer besser, um nicht jedem child im Ernstfall eine Klasse verpassen zu müssen. Aber das will ich gar nicht bemängeln, sondern dass der TE das, was Du postest blind übernimmt! Und das ist nicht Schuld des TE, sondern musst Du Dir zu Deiner Verantwortung als Helfender machen, sinnvolle Beispiele zu liefern. Bei Dir kommt immer gleich ne Lösung, die leider oft unsauber ist. Klar sie funktioniert, aber sinnvoll ist es oft nicht. Das weiß aber der TE nicht und nimmt das als gegeben und freut sch, dass jemand ihm die Arbeit abgenommen hat.


    Ganz ehrlich, auch als Anmerkung Richtung Stef, in den Entwickler-Foren, in denen ich aktiv bin, gibt es immer eine "Hilfe zur Selbsthilfe"-Attitüde. In der einen Community mehr als in anderen, aber sie ist überall vertreten. Deine Antworten machen das Prinzip in diesem kaputt. Aber Stef scheint das egal zu sein, oder sieht es anders?!


    Das heißt ja nicht, dass man keine Lösungen posten darf/soll, aber nicht bei jeder Antwort! Man kann auch mal den TE anregen, selbst auf die Lösung zu kommen, in dem man ihm etwas erklärt, evtl. mit Links anreichert, damit er sich gezielt informieren kann usw. und auf diese Weise auch etwas lernt!

    Der Vorteil dieses Verfahren ist, dass man relativ schnell merkt, wer einfach nur Lösungen will, ohne dafür etwas zu tun. Und ganz ehrlich, die haben dann auch keine Hilfe verdient. Du kannst dann ja gerne per PN Solution-Support leisten, das bleibt Dir überlassen.

    Ein Entwicklerforum ist aber aus meiner Sicht nicht dazu da. Lösungen am Fließband zu produzieren.


    Abgesehen davon, dass es den meisten im Lernprozess nichts hilft, wenn Sie ständig irgend etwas fertiges bekommen, musst Du Dir mal die Situation vor Augen führen, dass die mit ihren Projekten vielleicht auch mal jemand anders fragen, der dann die Hände über dem Kopf zusammenschlägt, was da tlw. für ein Blödsinn verzapft wurde. Das ist dann für den TE keine wenig peinliche Situation.

  • Du liebe Güte. Zunächst einmal vielen Dank für eure Hilfsbereitschaft. Aber ich wollte mit meiner Frage keinen Streit vom Zaun brechen.


    Nachdem ich mitbekommen habe, wie kompliziert das Ganze ist, liebäugle ich mit einer inversen Schrift. Denn ich müsste die andere Lösung auch Benutzern mit noch weniger Basiswissen erläutern, wie sie im TinyMCE von Joomla einem Text eine Klasse zuweisen. Da weiß ich jetzt schon, dass die meisten aussteigen würden.


    Leider muss ich derzeit dringlichere Arbeiten erledigen, sodass ich das Ganze erstmal auf Eis legen muss. Solange wird der Text eben schlicht fett formatiert.

  • Hey,


    Arne Drews : Deine Behauptungen, dass es mir egal sei, ich es anders sehe wie du oder das ich nichts mache stimmen nicht. Ich sehe es genau wie du. Ich bin zur Zeit am überlegen wie wir dies besser machen können.


    AK_CCM : Es liegt nicht an dir oder deiner Frage. Keine Angst. Die Beiträge der Mitglieder richteten sich an Basti1012.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!