Farbverlauf hinter dem Text

23.04.2015 09:09 (zuletzt bearbeitet: 23.04.2015 09:17)
#1 Farbverlauf hinter dem Text
Je
Mitglied

Guten Morgen zusammen :)

ich würde gerne einige Farbverläufe für meine Mitglieder erstellen, weiß aber nun nicht so genau, welchen Code ich verwenden soll.
Kann mir da vielleicht jemand helfen? Das wäre super

Das ganze sollte dann im nachhinein so aussehen:



Lg Jen


 Antworten

 Beitrag melden
23.04.2015 21:52
avatar  Olaf
#2 RE: Farbverlauf hinter dem Text
Ol
Mitglied

Ich nehme an,das Du den "Boxenheader" mit einen Farbverlauf haben möchtest?

Das lässt sich sehr komfortabel per CSS3 steuern.
Welche Farbe sollte es denn sein?

Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
25.04.2015 19:31
avatar  ( gelöscht )
#3 RE: Farbverlauf hinter dem Text
Gast
( gelöscht )

Hallo,

und wie geht das nun mit dem Farbverlauf, wenn ich das hinter einem Text einfügen will?

Würde es nämlich gerne ins Iconbar einfügen

Wer kann denn da helfen?

Danke


 Antworten

 Beitrag melden
25.04.2015 20:17 (zuletzt bearbeitet: 25.04.2015 20:19)
avatar  ( gelöscht )
#4 RE: Farbverlauf hinter dem Text
Gast
( gelöscht )

..im Falle der ersten Anfrage geht es offensichtlich um die Boxheader. Hier ließe sich mit folgendem Eintrag unter Admin→Layout→CSS ein Farbverlauf herstellen:

1
 
.box .boxheader {background: -moz-linear-gradient(50% 50% 230deg, #e887a7, #e05583, #d12c63  50%);}
 



Mit den beispielhaften Farbcodes und Zahlenwerten darf man so lange herum spielen, bis ein gewünschtes Ergebnis erzielt wurde. .-)

Eine andere Möglichkeit wäre , selbst eine Grafik mit Farbverlauf zu erstellen, diese in die Forengrafiken zu laden und dann per CSS als Hintergrundgrafik für z.Bsp. Boxheader einzusetzen.


 Antworten

 Beitrag melden
26.04.2015 00:12
avatar  ( gelöscht )
#5 RE: Farbverlauf hinter dem Text
Gast
( gelöscht )

Vielen Dank Firestone007 für deine Hilfe,
aber es geht nicht um den Boxheader wo ich das ganze Forum ändere, es geht um den Farbverlauf.

Was Jenny8fer meint ist, das man auch Schatten zu sagen kann.
Wir wollen es wie eine Linie bei Iconbar einfügen.
Brauchen aber CSS und das Ersetzen

Und da wissen wir den Code nicht wie man das macht.

LG


 Antworten

 Beitrag melden
26.04.2015 11:20 (zuletzt bearbeitet: 26.04.2015 11:23)
avatar  Olaf
#6 RE: Farbverlauf hinter dem Text
Ol
Mitglied

Zitat von Jason Foster im Beitrag #5

aber es geht nicht um den Boxheader wo ich das ganze Forum ändere, es geht um den Farbverlauf.

Und da wissen wir den Code nicht wie man das macht.



Ich hatte das in Jenny8fer ihr Screenshot auch so gesehen,das es um den Boxenheader geht.
Wir können auch nur Hilfestellungen geben,den Code für die Farben solltet ihr schon selber bestimmen können.

Hier mein Vorschlag (Aussehen vom Scrennshot):
Im Adminmenü unter "Layout→Iconbar" folgendes unter den Reiter "Foren-Code" das eingeben (Bild 1):
Ersetze: [farbverlauf]...[/farbverlauf]
Mit: <div class="farbverlauf">...</div>
Grafik: https://files.homepagemodules.de/b214495/bhnetfiles-k8v1-4e-773d.gif (das ist meine Grafik,die Du ändern kannst)
und nun noch "Speichern" drücken.
Nun noch einen CSS Eintrag machen im Adminmenü unter "Layout→CSS" im Fenster folgendes eintragen

1
2
3
4
 
.farbverlauf {
background-image: linear-gradient(#936BFF, #F0EBFF);
background-image: -webkit-linear-gradient(#936BFF, #F0EBFF);
}
 


Speichern drücken.
Der zusätzliche webkit Eintrag ist für den Safari,und den Code habe ich noch zusätzlich im IE,FF,Chrome und Opera erfolgreich getestet.
Hier in meinem Testforum das Ergebniss:
http://138600.homepagemodules.de/t78f2-U...est.html#msg465

Natürlich lässt sich mit der Eigenschaft "gradient" noch viel mehr anstellen.
Mein Beispiel ist sehr einfach,der erste Farbcode ist die Startfarbe von oben und die zweite Farbe ist die Endfarbe unten.Dazwischen wird der Farbverlauf vom Browser berechnet und angezeigt.

Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
26.04.2015 12:11 (zuletzt bearbeitet: 26.04.2015 12:25)
avatar  ( gelöscht )
#7 RE: Farbverlauf hinter dem Text
Gast
( gelöscht )

.. hallo zusammen. Ich sehe gerade, dass Olaf schon fleißig war. Da ich gleichlaufend auch grad was ausprobiert habe, möchte ich mein Testergebnis auch zum besten geben. Ich habe die CSS-Klasse schon mal mit ein paar wenigen Attributen geschmückt:

1
 
.text_hg {width: 80%;padding: 15px; background: -moz-linear-gradient(50% 50% 230deg, #e887a7, #e05583, #d12c63  50%); background-size: 100% 100%; text-align: center;}
 



Der Eintrag 230deg betsimmt hierbei den Winkel des Farbverlaufes, 90deg würden einem vertikalem Verlauf entsprechen, 180deg einem horizontalen.

Für den Forencode, den Olaf bereits beschrieben hat, habe ich Ersetze [fvl] ... [/fvl] mit <p class="text_hg"> ... </p> eingetragen. Das Ergebnis würde im Falle für den markierten Textbereich so aussehen:



Die Farbwerte und Prozente müssen natürlich entsprechend angepasst werden und auch den -webkit Eintrag von Olaf bitte noch dazu nehmen für andere Browser.


 Antworten

 Beitrag melden
26.04.2015 18:27
avatar  ( gelöscht )
#8 RE: Farbverlauf hinter dem Text
Gast
( gelöscht )

Vielen Dank ihr lieben


 Antworten

 Beitrag melden
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!