Jimdo-Userforum » Jimdo User-Forum » Allgemeines » Miami - Contentbereich transparent setzen

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

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

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

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

...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

@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?

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

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.

...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);
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

@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

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

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

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

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 ;)]

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

Könnte man den Code übernehmen?
VG Ulli

...ich würde an Deiner Stelle den Code übernehmen, den ich auf http://miami-designtest.jimdo.com/ verwendet habe:
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

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_ !