#1 Miami - Contentbereich transparent setzen von christine_a 07.03.2016 12:01

avatar

Moin,
gibt es eine Möglichkeit, den Contentbereich auch transparent zu setzen? Oder "halbtransparent", so dass die Hintergrundbilder etwas mehr "durchscheinen"?
Ich habe spasseshalber einfach mal die Ziffern aus dem css-Code/Header in den css-Code/Content-wrap übernommen, das funktioniert leider nicht :(
Gruß, christine_a

#2 RE: Miami - Contentbereich transparent setzen von christine_a 07.03.2016 12:42

avatar

Mit Änderung über Style -> Hintergrund mit rgba (0,0,0) oder (247,248,248,0.9) tut sich auch nichts.
Ich hätte es eigentlich ganz gern wieder so wie hier, eben auch mit dem Inhalt NICHT über die ganze Seite.

http://zickenriegentest.jimdo.com/

Ich denke, mit dem Lesen sollte es keine Schwierigkeiten geben, der Hintergrund ist ja trotz Transparenz immer noch hell genug.

Gruß, christine_a

#3 RE: Miami - Contentbereich transparent setzen von CharlieW 07.03.2016 14:42

avatar

Du siehst keinen Unterschied, weil sich kein Bild hinter der weißen Farbe befindet.

#4 RE: Miami - Contentbereich transparent setzen von christine_a 08.03.2016 08:11

avatar

@CharlieW
? Das heisst also, die Antwort auf meine Frage wäre "nein"? Schade.

#5 RE: Miami - Contentbereich transparent setzen von az_ 08.03.2016 12:03

avatar

...du hast doch für den Hintergrund des Header-Titels einen Code verwendet - dann kannst Du diese Einstellung auch nur über den Code ändern :)

Die Transparenz änderst Du mit der 4 Stelle beim RGBA-Code: rgba(255,255,255,0.5) ist weiß mit 50% Transparenz.
1 = 100% Opak und 0 = 100% Transparenz


LG, az

#6 RE: Miami - Contentbereich transparent setzen von christine_a 08.03.2016 12:41

avatar

@az_
Aha! Funktioniert aber auch nicht... eine Änderung der 4. Ziffer bewirkt rein gar nichts.

Das hier ist Dein Code, den ich bei beiden Seiten im Header hinterlegt habe:

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

.content-options {
background-color:transparent !important; /*Hintergrund transparent*/
}

.wrap {
background-color: rgba(247,248,248,0.9); /*Unterlegung*/
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}

div#cc-website-title {
max-width: 800px;
background-color: rgba(255,255,255,.8);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
margin: 100px auto 90px;
padding: 45px 0;
}

div#cc-website-logo {
display:none; /*killt das Logo*/}

/*]]>*/
</style>



Dann müsste es doch auf beiden Seiten auch gleich aussehen?!? Oder liegt's am alten und neuen Miami? Fehlt mir noch ein Code?

#7 RE: Miami - Contentbereich transparent setzen von DerPodenco 08.03.2016 15:38

avatar

Soweit ich weiß, ist das "Hintergrundbild" nicht mehr über die gesamte Seite sichtbar.

#8 RE: Miami - Contentbereich transparent setzen von christine_a 08.03.2016 18:17

avatar

Ah, danke! Jetzt hab' ich's begriffen :)
Schade auch. Da ist dann wohl ein "Umzug" zum neuen Design fällig, Rio wäre das Auserwählte... Das ist dann aber wieder nicht responsive :(
Achmenno.

#9 RE: Miami - Contentbereich transparent setzen von az_ 09.03.2016 13:29

avatar

...nö, das klappt schon!

- ersetz mal in meinem Code bei div#cc-website-title die background-color: rgba(255,255,255,0.8); durch background-color: rgba(255,255,255,0.4);

1
2
3
4
5
6
7
8
9
 
div#cc-website-title {
max-width: 800px;
background-color: rgba(255,255,255,0.4);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
margin: 100px auto 90px;
padding: 45px 0;
}
 



...und schon ist der Titel mit mehr Transparenz unterlegt:



oder habe ich Dich falsch verstanden?

LG, az

#10 RE: Miami - Contentbereich transparent setzen von christine_a 09.03.2016 14:02

avatar

@az_
falsch verstanden :)
Ich wollte den Inhaltsbereich transparent haben, der Titel ist es ja schon;
bin jetzt auf "Rio" umgestiegen, da klappt das immerhin mit der Transparenz des Inhaltes.
Dafür sind die Unterseiten der Navi-Leiste flöten
Am responsive-Ding arbeitet Jimdo ja nach Deiner Aussage, da kann ich also noch hoffen.
Gruß, christine_a

#11 RE: Miami - Contentbereich transparent setzen von az_ 09.03.2016 14:24

avatar

...dann würde ich es mit Miami machen und die Hintergrundbilder wieder auf cover setzen. Dann sind die wieder ganzseitig.

LG, az

#12 RE: Miami - Contentbereich transparent setzen von DerPodenco 09.03.2016 15:54

avatar

Das geht? Wäre ja zu schön!

#13 RE: Miami - Contentbereich transparent setzen von christine_a 09.03.2016 16:16

avatar

Was ist denn nu' wieder "cover"?!?

#14 RE: Miami - Contentbereich transparent setzen von christine_a 11.03.2016 08:19

avatar

Bin nach wie vor (testweise) auf "Rio", bis auf die fehlende Unternavigationsanzeige gefällt mir das sehr gut; UND es ist jetzt auch 'responsive' :) Yeah!
@az_ Wenn Du mir noch verrätst, was das mit dem "cover" zu bedeuten hat, versuch' ich mich vielleicht doch nochmal an Miami; Jimdo hat mir noch Malaga vorgeschlagen, weil da Transparenz und Unterseiten dabei sind. [Dafür fehlt der Seitentitel, irgendwas ist ja immer ;)]

#15 RE: Miami - Contentbereich transparent setzen von az_ 12.03.2016 07:41

avatar

...schau mal hier: https://developer.mozilla.org/de/docs/We...background-size

LG, az

#16 RE: Miami - Contentbereich transparent setzen von DerPodenco 13.03.2016 17:48

avatar

Könnte man den Code übernehmen?

VG Ulli

#17 RE: Miami - Contentbereich transparent setzen von az_ 13.03.2016 22:03

avatar

...ich würde an Deiner Stelle den Code übernehmen, den ich auf http://miami-designtest.jimdo.com/ verwendet habe:

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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
 
<style type="text/css">
/*<![CDATA[*/

 
body.jqbga-container.jqbga-web--image {
background-repeat:no-repeat;
background-attachment: fixed;
background-size: cover;
background-size: 100vw auto; /*Breite=100%, Höhe automatisch*/
background-position: center 0;
}

.jtpl-header {
padding-top: 400px;
padding-top: calc(100vw * 0.3) !important; /*Höhe Header-Bereich: 100% Fensterbreite x Bildhöhe/Bildbreite*/
}

.jtpl-logo {margin: 0; padding: 0;}

#cc-website-logo {
position:absolute;
width:80%;
top:1em;
left:10%;
margin:0 auto;
padding:0;
min-height:150px;
}

/* Navigation
------------------------------------------------------- */
.jtpl-navigation--desktop.navigation-colors {
position:fixed;
height:5em;
}
 
.jtpl-navigation--desktop__inner {
max-width: 320px; /*max. Breite, gff. anpassen!*/
width: 100%;
margin-left: auto;
margin-right: 0.2em; /*Abstand rechts*/
}
 
/* Mobiles CSS
-----------------------------------------------------------*/
 
@media only screen and (max-width: 767px) {
span#cc-m-header-10356940323 {font-size:1.35em !important; font-weight:bold;}
.jtpl-header {padding-top:1em !important;}
#cc-website-logo {width:2.5em; padding:0;}
}

/*]]>*/
</style>
 



Beachte die Anmerkungen!

LG, az

#18 RE: Miami - Contentbereich transparent setzen von christine_a 14.03.2016 09:10

avatar

Zitat
...schau mal hier: https://developer.mozilla.org/de/docs/We...background-size



puuuh... ja, nee, ok, ich bleib' dann erstmal bei Rio, bis auf die Navigation ist es ja das, was ich haben will;
developer - das ist mir doch ein paar Nummern zu groß; trotzdem Danke für den Tip, @az_ !

Xobor Einfach ein eigenes Forum erstellen
Datenschutz