Do it yourself: CSS für Profil und Blog

@-Anna-
Danke, hat auch bei mir geklappt :) Und wie kann ich die Schriftfarbe davon ändern?

@QonoS

a.attitel:before {
content:"TEXT";
color: #F3C549;
visibility:visible;
}

Zeile mit Wunschfarbe da noch einfügen, so sollte es klappen. :)

@Eseneziri
Hat geklappt, danke dir :)

@QonoS
Jo, gerne. :D

Weiß jemand, warum ich auf meinem Profil keine Websiten einbinden kann? Ich wollte eigentlich über

<*iframe src="'http:// www. hier ist die adresse der zweiten Seite" width="1000" height="1000" frameborder="0" allowTransparency="true"></iframe>

eine Allmystery-Seite einbinden, aber es zeigt mir immer den Fehler 404 an. Liegt das an Allmy selbst oder passt was in meinem Code nicht? @dns, vielleicht hast du da eine Idee?
Ist für einen guten Zweck ;)

@Luminita

Versuche mal da wo der Link ist, den --> ' wegzumachen, könnte daran liegen.

-Anna- schrieb:könnte daran liegen.

daran liegt es

@Bishamon

Hab ich's mir schon gedacht.

Orrrrrr. -.- Danke :D @-Anna-
@Bishamon

Hallo, ich hab ein Problem und bekomme es nicht geregelt.
Zum einen sieht man die Schrift in der Infoleiste nicht, die würde ich gerne schwarz, Farbe #12100e machen, genauso wie bei profilinfo.

Ausserdem ist oben im header noch grau und nicht transparent. Wie bekomme ich das alles hin?

Mein Style sieht derzeit so aus

Spoiler <style> * {cursor:crosshair}</style>
<style>
<style>
body {color: #12100e;}
a {text-decoration: none; color: #12100e;}
a:visited {color: #12100e;}
a:hover {color: #12100e;}


.header {background: none; background-color: transparent;}

.tabnav,
.tabnav a,
.tabnav a:hover,
#tabnav-all-opener,
#tabnav-all-opener:hover {
background: none;



}

a, a.man, a:link, a:visited {
color: #12100e;
}

a.attitel{visibility:hidden;}
a.attitel:before{content:"";
color: #12100e;
visibility:visible;
}


.profile_links a img {visibility: hidden; display: block;}

.mcell, .mcell_status {
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;
-webkit-border-top-left-radius: 8px 8px;
-webkit-border-top-right-radius: 8px 8px;
}
.mcell_inhalt

.mcell2 {background-color: #12100e;}
.mcell_inhalt {
background-color: #12100e;
border-bottom-left-radius: 8px 8px;
border-bottom-right-radius: 8px 8px;
-moz-border-radius: 0 0 8px 8px;
-webkit-border-bottom-left-radius: 8px 8px;
-webkit-border-bottom-right-radius:8px 8px;
}

.gb_post {
background-color: #12100e; padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;
-webkit-border-top-left-radius: 8px 8px;
-webkit-border-top-right-radius: 8px 8px;
border-bottom-left-radius: 8px 8px;
border-bottom-right-radius: 8px 8px;
-moz-border-radius: 0 0 8px 8px;
-webkit-border-bottom-left-radius: 8px 8px;
-webkit-border-bottom-right-radius:8px 8px;
background-color: #b58e74; opacity: 0.6;
padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;

}

.infoleiste{
background-color: #12100e; padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;
-webkit-border-top-left-radius: 8px 8px;
-webkit-border-top-right-radius: 8px 8px;
border-bottom-left-radius: 8px 8px;
border-bottom-right-radius: 8px 8px;
-moz-border-radius: 0 0 8px 8px;
-webkit-border-bottom-left-radius: 8px 8px;
-webkit-border-bottom-right-radius:8px 8px;
background-color: #b58e74; opacity: 0.6;
padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;

}


.profile_info{
background-color: #2f2942; padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;
-webkit-border-top-left-radius: 8px 8px;
-webkit-border-top-right-radius: 8px 8px;
border-bottom-left-radius: 8px 8px;
border-bottom-right-radius: 8px 8px;
-moz-border-radius: 0 0 8px 8px;
-webkit-border-bottom-left-radius: 8px 8px;
-webkit-border-bottom-right-radius:8px 8px;
background-color: #b58e74; opacity: 0.6;
padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;

}

.mcell_inhalt{
background-color: #2f2942; padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;
-webkit-border-top-left-radius: 8px 8px;
-webkit-border-top-right-radius: 8px 8px;
border-bottom-left-radius: 8px 8px;
border-bottom-right-radius: 8px 8px;
-moz-border-radius: 0 0 8px 8px;
-webkit-border-bottom-left-radius: 8px 8px;
-webkit-border-bottom-right-radius:8px 8px;
background-color: #b58e74; opacity: 0.6;
padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;

}



.tabnav a,.topnav{
background-color: #2f2942; padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;
-webkit-border-top-left-radius: 8px 8px;
-webkit-border-top-right-radius: 8px 8px;
border-bottom-left-radius: 8px 8px;
border-bottom-right-radius: 8px 8px;
-moz-border-radius: 0 0 8px 8px;
-webkit-border-bottom-left-radius: 8px 8px;
-webkit-border-bottom-right-radius:8px 8px;
background-color: #b58e74; opacity: 0.6;
padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;

}

.head_links{
background-color: #2f2942; padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;
-webkit-border-top-left-radius: 8px 8px;
-webkit-border-top-right-radius: 8px 8px;
border-bottom-left-radius: 8px 8px;
border-bottom-right-radius: 8px 8px;
-moz-border-radius: 0 0 4px 4px;
-webkit-border-bottom-left-radius: 4px 4px;
-webkit-border-bottom-right-radius:4px 4px;
background-color: #b58e74; opacity: 0.6;
padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;

}


.tabnav-all{
background-color: #2f2942; padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;
-webkit-border-top-left-radius: 8px 8px;
-webkit-border-top-right-radius: 8px 8px;
border-bottom-left-radius: 8px 8px;
border-bottom-right-radius: 8px 8px;
-moz-border-radius: 0 0 4px 4px;
-webkit-border-bottom-left-radius: 4px 4px;
-webkit-border-bottom-right-radius:4px 4px;
background-color: #b58e74; opacity: 0.6;
padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;

}

.profile_links {
background-color: #2f2942; padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;
-webkit-border-top-left-radius: 8px 8px;
-webkit-border-top-right-radius: 8px 8px;
border-bottom-left-radius: 8px 8px;
border-bottom-right-radius: 8px 8px;
-moz-border-radius: 0 0 4px 4px;
-webkit-border-bottom-left-radius: 4px 4px;
-webkit-border-bottom-right-radius:4px 4px;
background-color: #b58e74; opacity: 0.6;
padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;

}

.infoleiste {
background-color: #2f2942; padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;
-webkit-border-top-left-radius: 8px 8px;
-webkit-border-top-right-radius: 8px 8px;
border-bottom-left-radius: 8px 8px;
border-bottom-right-radius: 8px 8px;
-moz-border-radius: 0 0 4px 4px;
-webkit-border-bottom-left-radius: 4px 4px;
-webkit-border-bottom-right-radius:4px 4px;
background-color: #b58e74; opacity: 0.6;
padding: 12px;
border-top-left-radius: 8px 8px;
border-top-right-radius: 8px 8px;
-moz-border-radius:8px 8px 0 0;

}

.profile_last_post{display:none;}

.profile_info small{display:none;}
.created_threads{display:none;}
.profile_info, div.profile_pic object{text-align:left;}

.profile_info {width:400px;padding:4px;border: 2px solid #12100e;border-radius: 18px !important

}

.profile_info{color: #12100e;}
.head_links{color: #12100e;}
.h2{color: #12100e;}
.head_links{width:400px;padding:4px;border: 2px solid #12100e;border-radius: 18px !important



}

.profile_links {width:400px;padding:4px;border: 2px solid #12100e;border-radius: 18px !important

}


.gb_post{width:400px;padding:4px;border: 2px solid #12100e;border-radius: 18px !important

}

.tabnav-all{width:400px;padding:4px;border: 2px solid #12100e;border-radius: 18px !important

}

.infoleiste{width:160px;padding:4px;border: 2px solid #12100e;border-radius: 18px !important





a.tab, #tabnav-all-opener {
background-color: #12100e; opacity: 0.6;

}


</style>

<style>

.compact_slider {
width: 100vw;
height: 100vh;
position: fixed;
top: 0;
left: 0;
text-align: center;
box-shadow: inset 0 50px 111px 0 #00000090;
z-index: -1;
}

.compact_slider img {
width: 100vw;
height: 100vh;
position: absolute;
top: 0px;
left: 0px;
}

.compact_slider img {
-webkit-animation-name: compact_slider;
-webkit-animation-timing-function: ease;
-webkit-animation-duration: 64s;
-webkit-animation-iteration-count: infinite;
animation-name: compact_slider;
animation-timing-function: ease;
animation-duration: 64s;
animation-iteration-count: infinite;
}

@-webkit-keyframes compact_slider {
0% {opacity:1;} 20% {opacity:0;} 80% {opacity:0;} 100% {opacity:1;}
}
@keyframes compact_slider {
0% {opacity:1;} 20% {opacity:0;} 80% {opacity:0;} 100% {opacity:1;}
}

.compact_slider img:nth-child(1) { -webkit-animation-delay: 64s; animation-delay: 64s; }
.compact_slider img:nth-child(2) { -webkit-animation-delay: 56s; animation-delay: 56s; }
.compact_slider img:nth-child(3) { -webkit-animation-delay: 48s; animation-delay: 48s; }
.compact_slider img:nth-child(4) { -webkit-animation-delay: 40s; animation-delay: 40s; }
.compact_slider img:nth-child(5) { -webkit-animation-delay: 32s; animation-delay: 32s; }
.compact_slider img:nth-child(6) { -webkit-animation-delay: 24s; animation-delay: 24s; }
.compact_slider img:nth-child(7) { -webkit-animation-delay: 16s; animation-delay: 16s; }
.compact_slider img:nth-child(8) { -webkit-animation-delay: 8s; animation-delay: 8s; }
.compact_slider img:nth-child(9) { -webkit-animation-delay: 0s; animation-delay: 0s; }

</style>

<div class="compact_slider">
<img src="https://www.allmystery.de/i/jhgwsidegigb_IMG_20200718_004305.jpg">
<img src="https://www.allmystery.de/i/jhgwsidegigb_IMG_20200718_004305.jpg">
<img src="https://www.allmystery.de/i/lsisxovgowcy_IMG_20200717_233220.jpg">
<img src="https://www.allmystery.de/i/lsisxovgowcy_IMG_20200717_233220.jpg">
<img src="https://www.allmystery.de/i/jhgwsidegigb_IMG_20200718_004305.jpg">
<img src="https://www.allmystery.de/i/jhgwsidegigb_IMG_20200718_004305.jpg">
<img src="https://www.allmystery.de/i/lsisxovgowcy_IMG_20200717_233220.jpg">
<img src="https://www.allmystery.de/i/lsisxovgowcy_IMG_20200717_233220.jpg">
<img src="https://www.allmystery.de/i/jhgwsidegigb_IMG_20200718_004305.jpg">
</div>

<style>
.profile_pic iframe {
visibility: hidden;
}
</style>



<br><style>
img.opacity {
opacity: 0.01;
1. filter: alpha(opacity=40);-webkit-transition: opacity 2s linear;
2. }

img.opacity:hover {
opacity: 1;
filter: alpha(opacity=100);-webkit-transition: opacity 1,5s linear;}</style>


Vielen Dank für eure Hilfe :)

ProjectSerpo schrieb:Ausserdem ist oben im header noch grau und nicht transparent. Wie bekomme ich das alles hin?

Das Problem habe ich auch, irgendwas hat sich da geändert und jetzt klappt nix, was ich versuche.

@QonoS
@Luminita

Ich habe jetzt einiges ausprobiert was den header betrifft, aber auch ich bin da mit meinem Latein am Ende.
Egal was ich versucht habe, ich bekomme es nicht transparent hin.
Bei mir ist der header immer ausgeblendet. Aber das ist ja auch keine Lösung.
Vlt gibt es ja hier jemanden der sich noch besser auskennt und Euch helfen kann.

@-Anna-
Ich hab ihn jetzt auch einfach ausgeblendet, aber damit ist auch das Allmy Logo verschwunden und auch das krieg ich nicht wieder her. Bisschen ärgerlich.

@QonoS
@Luminita
@-Anna-

So klappt's bei mir:

header {
background: transparent;
box-shadow:none;
}

Wichtig: Nicht .header,
sondern header (ohne Punkt davor).

Dann seh ich mein eigenes Hintergrundbild auch im Header.

Klappt das bei euch auch?

-----------------------------------------------------

Edit:
Habe

box-shadow:none;


mal rausgelöscht, klappt immernoch, sehe jedenfalls keine Schatten ... O.o :ask:

@Eseneziri
Interessant! Ich teste, sobald ich Zuhause am PC bin :)

@Eseneziri

Das müssten dann @QonoS und @Luminita mal austesten.
Ich habe bei mir im Profil grundsätzlich alles ausgeblendet was geht.
Könnte aber funktionieren was Du gespostet hast. Dann ist das geändert, dass man den header nicht mehr mit .header
anspricht, sondern ohne den Punkt davor. Deswegen hat es bei mir nicht geklappt. :)

@Eseneziri
@-Anna-

Bin gerade unterwegs, sobald ich zuhause am Notebook bin, werde ich das mal ausprobieren, danke :)
Könnt ihr mir auch bei der Schrift helfen? In der Freundesliste erkennt man nichts, die hätte ich dunkler, mit #12100e, vielen Dank.

ProjectSerpo schrieb:Könnt ihr mir auch bei der Schrift helfen? In der Freundesliste erkennt man nichts, die hätte ich dunkler, mit #12100e, vielen Dank.

Meinst du das?

- die Usernamen in der Freundesliste, an-, abwesend, sowie "Verwaltung", "Rundschreiben" und "System" mit deiner Farbe:
a.fl-user {
background: -webkit-linear-gradient(#12100e, #12100e);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

Falls du beim Drüberfahren mit der Maus 'ne andere Farbe haben willst, an entsprechenden Stellen die Wunschfarbe einfügen:

a.fl-user:hover {
background: -webkit-linear-gradient(#FFFCB0, #FFFCB0);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}


Ich weiß nicht, ob das 'ne saubere Lösung ist mit dem Gradient, aber es klappt bei mir damit.
Wenn ich's mit "color: #irgendwas" versuche, wie bei anderen Dingern, dann wird's doch wieder grau wie im Forum. o.o

Eseneziri schrieb:header {
background: transparent;
box-shadow:none;
}

Eseneziri schrieb:Meinst du das?

- die Usernamen in der Freundesliste, an-, abwesend, sowie "Verwaltung", "Rundschreiben" und "System" mit deiner Farbe:
a.fl-user {
background: -webkit-linear-gradient(#12100e, #12100e);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

Ja, das meinte ich, hat aber leider nicht geklappt, ist aber nicht weiter schlimm, ich werde die Freundesliste ganz raus nehmen (hatte früher nie eine drin gehabt) und den header werde ich wie @-Anna- auch raus nehmen :)

@QonoS
Beides hat nicht geklappt? Oha. o.o
Vermutlich hab ich noch irgendwo anders was anders gemacht und krieg's nicht mehr auf die Kette, sorry!