Miami - Contentbereich transparent setzen
#1
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
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
#4
...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
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
#6
#7
#8
...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
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
#10
@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
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
#12
#13
#14
...schau mal hier: https://developer.mozilla.org/de/docs/We...background-size
LG, az
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
#16
...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
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
#18
Ähnliche Themen
Jetzt anmelden!
Jetzt registrieren!
