Hintergrundfarbe als Farbverlauf

Antworten
  • Seite 1 von 2
#1
22.11.2017 13:17 (zuletzt bearbeitet: 28.11.2017 17:21)
avatar  Hans-Dieter
#1
Ha
Hans-Dieter

Hallo, habe mich gerade angemeldet und komme gleich mit einer Frage:

Gibt es eine / kennt jemand eine Möglichkeit bei dem Inhaltsbereich und der Navigation die
Hintergrundfarbe als Farbverlauf (von oben Gelb, nach unten Weiss) einzustellen?

Gruß
Dieter


 Antworten

 Beitrag melden
#2
22.11.2017 14:42 (zuletzt bearbeitet: 28.11.2017 17:21)
avatar  TiJo
#2
Ti
TiJo

bitte vergib aussagekräftige Titel!


 Antworten

 Beitrag melden
#3
22.11.2017 14:51 (zuletzt bearbeitet: 28.11.2017 17:21)
avatar  Hans-Dieter
#3
Ha
Hans-Dieter

Entschuldige, werde mich bessern!
Da aber bereits beantwortet kann ich es nicht mehr ändern!


 Antworten

 Beitrag melden
#4
22.11.2017 15:34 (zuletzt bearbeitet: 28.11.2017 17:22)
avatar  TiJo
#4
Ti
TiJo

dann hier zu deine Frage:

Du kannst hier deinen Farbverlauf erstellen und als CSS herauskopieren. Den fügst du an die entsprechende Stelle in deinem Head-Bereich ein


 Antworten

 Beitrag melden
#5
22.11.2017 16:35
avatar  Hans-Dieter
#5
Ha
Hans-Dieter

Danke für die Antwort,
da ich aber Neuling bin weitere Frage:

Was ist die entsprechende Stelle?

Gehe ich auf Einstellungen/Head-Bereich ist bei mir noch alles leer.


 Antworten

 Beitrag melden
#6
22.11.2017 16:48
avatar  TiJo
#6
Ti
TiJo

poste doch bitte mal deine URL. Damit tun wir uns leichter dir zu helfen :)


 Antworten

 Beitrag melden
#7
22.11.2017 16:52 (zuletzt bearbeitet: 28.11.2017 17:22)
avatar  Hans-Dieter
#7
Ha
Hans-Dieter

Hier die Sache die ich gerade für Bekannte erstelle:

https://www.erdbeer-gummert.de/

Auf der Startseite siehst du den Farbverlauf in der Fahne und es wäre schön
wenn der Farbverlauf so in den beiden jetzt durchscheinen weißen Feldern wäre.


 Antworten

 Beitrag melden
#8
22.11.2017 16:58
avatar  TiJo
#8
Ti
TiJo

1
2
3
4
5
6
7
8
9
10
11
12
13
 

<style type="text/css">
/*<![CDATA[*/
.sidebar-options-box
{
background: #f7f72a; /* Old browsers */
background: -moz-linear-gradient(top, #f7f72a 0%, #ffffff 81%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f7f72a 0%,#ffffff 81%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f7f72a 0%,#ffffff 81%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f72a', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
/*]]>*/
</style>
 



Das sollte in den Head-Bereich für die Gesamte Seite


 Antworten

 Beitrag melden
#9
22.11.2017 17:01 (zuletzt bearbeitet: 28.11.2017 17:22)
avatar  Hans-Dieter
#9
Ha
Hans-Dieter

Danke, super!
Aber nun auch noch für die Linke Seite?


 Antworten

 Beitrag melden
#10
22.11.2017 17:08 (zuletzt bearbeitet: 28.11.2017 17:22)
avatar  TiJo
#10
Ti
TiJo

versuch mal:

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<style type="text/css">
/*<![CDATA[*/
.sidebar-options-box,
.content-options
{
background: #f7f72a; /* Old browsers */
background: -moz-linear-gradient(top, #f7f72a 0%, #ffffff 81%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f7f72a 0%,#ffffff 81%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f7f72a 0%,#ffffff 81%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f72a', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
/*]]>*/
</style>
 


 Antworten

 Beitrag melden
#11
22.11.2017 17:10
avatar  Hans-Dieter
#11
Ha
Hans-Dieter

S U P E R , Danke.


 Antworten

 Beitrag melden
#12
22.11.2017 17:14 (zuletzt bearbeitet: 28.11.2017 17:23)
avatar  TiJo
#12
Ti
TiJo

kleiner Nachtrag:
mit rgba - Code bekommst du auch die Transparenz hin.

1
2
3
4
 
background: -moz-linear-gradient(top, rgba(247,247,43,0.68) 0%, rgba(255,255,255,0.68) 57%, rgba(255,255,255,0.68) 100%);
background: -webkit-linear-gradient(top, rgba(247,247,43,0.68) 0%,rgba(255,255,255,0.68) 57%,rgba(255,255,255,0.68) 100%);
background: linear-gradient(to bottom, rgba(247,247,43,0.68) 0%,rgba(255,255,255,0.68) 57%,rgba(255,255,255,0.68) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#adf7f72b', endColorstr='#adffffff',GradientType=0 );
 


 Antworten

 Beitrag melden
#13
27.11.2017 20:27 (zuletzt bearbeitet: 28.11.2017 17:23)
avatar  Hans-Dieter
#13
Ha
Hans-Dieter

Hallo, ich schon wieder mit folgender Frage:

Wie kann man das Logo und den Navigationsbereich fixieren ohne das der Gelb-Weiße Hintergrund verloren geht?

Habe es hiermit probiert,

1
2
3
4
5
 

.jtpl-navigation {
position:fixed;
}
 
 



wahrscheinlich an falscher Stelle eingefügt und dann ist der Hintergrund weg.

Danke im Vorraus


 Antworten

 Beitrag melden
#14
28.11.2017 17:23
avatar  az_
#14
avatar
az_

...poste mal Dein ganzes CSS


Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).

Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!


...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de

Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de


Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html


 Antworten

 Beitrag melden
#15
28.11.2017 17:27
avatar  Hans-Dieter
#15
Ha
Hans-Dieter

.... siehe hier:


<style type="text/css">
/*<![CDATA[*/

.sidebar-options-box,
.content-options
{
background: #f7f733; /* Old browsers */
background: -moz-linear-gradient(top, #f7f733 0%, #ffffff 81%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f7f733 0%,#ffffff 81%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f7f733 0%,#ffffff 81%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f733', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.sidebar-options-box,
.cc-content-parent {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-border-radius: 5px;
}

/*]]>*/
</style>

Denk an die Antwort auf meine PN!


 Antworten

 Beitrag melden
#16
28.11.2017 18:27
avatar  TiJo
#16
Ti
TiJo

In deiner CSS steht doch dein Code gar nicht drin?


 Antworten

 Beitrag melden
#17
28.11.2017 19:01
avatar  Hans-Dieter
#17
Ha
Hans-Dieter

Habe ich wieder raus genommen weil es nicht so funktionierte wie gewünscht!


 Antworten

 Beitrag melden
#18
28.11.2017 19:38
avatar  TiJo
#18
Ti
TiJo

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
 
<style type="text/css">
/*<![CDATA[*/
 
.sidebar-options-box,
.content-options
{
background: #f7f733; /* Old browsers */
background: -moz-linear-gradient(top, #f7f733 0%, #ffffff 81%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f7f733 0%,#ffffff 81%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f7f733 0%,#ffffff 81%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f733', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.sidebar-options-box,
.cc-content-parent {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-border-radius: 5px;
}
 
.sidebar-options-box
{
position:fixed;
right: 0;
}
 
/*]]>*/
</style>
 



sollte es wohl tun. Allerdings stimmt dann deine Schale darunter nicht mehr. Da bin ich noch dran.


 Antworten

 Beitrag melden
#19
28.11.2017 20:26
avatar  Hans-Dieter
#19
Ha
Hans-Dieter

Danke,
aber nun ist das feld ganz am rechten Rand.
Geht das zu ändern?

Die Schale ist unwichtig, bitte da nicht drum kümmern, wird gelöscht!


 Antworten

 Beitrag melden
#20
28.11.2017 20:33
avatar  Hans-Dieter
#20
Ha
Hans-Dieter

Habe es gefunden!
Bei Right einen Wer XXpx einsetzen, werde probieren welcher Wert am besten.

Nochmal DANKE und antworte auf meine PN!

Gruß
Dieter


 Antworten

 Beitrag melden
#21
28.11.2017 20:56
avatar  Hans-Dieter
#21
Ha
Hans-Dieter

Doch noch eine kleine Sache, so haut es noch nicht ganz hin:

Durch die Ausrichtung am rechten Rand vergrößert/verkleinert sich der Abstand zum Textbereich wenn rechts
der Scrollbalken da ist oder nicht da ist.

Hast du noch eine andere Idee?


 Antworten

 Beitrag melden
#22
28.11.2017 21:04
avatar  TiJo
#22
Ti
TiJo

Vielleicht klappts dann mit left: ..px;?


 Antworten

 Beitrag melden
#23
28.11.2017 21:10
avatar  Hans-Dieter
#23
Ha
Hans-Dieter

Hätte ich auch drauf kommen können, werde testen.


 Antworten

 Beitrag melden
#24
28.11.2017 21:33
avatar  Hans-Dieter
#24
Ha
Hans-Dieter

Klappte auch nicht,
habe nun bei den Seiten wo es sich verschob Leerzeilen eingefügt.
Nun ist der Scrollbalken immer da,


 Antworten

 Beitrag melden
#25
30.11.2017 08:32
avatar  Hans-Dieter
#25
Ha
Hans-Dieter

Hallo, ich schon wieder mit einer ganz speziellen Frage:

Kennst du / jemand eine Möglichkeit dass dieses fixieren der Navigationsleiste
nur im Ansichtsmodus stattfindet?

Im Bearbeitungsmodus stört es, da ich dort nicht an alle (unsichtbaren) Punkte ran komme.


 Antworten

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