Skocz do zawartości

Jak dodać tło (background) pod DVZ Shoutbox?


Prezydent™
 Udostępnij

Rekomendowane odpowiedzi

  • Administrator

Druga linia kodu:
Zamien to:
 

#shoutbox {width: 100%;margin: auto auto;background: #;border-radius: 6px;margin-bottom: 20px;}

Na to

#shoutbox {
    width: 100%;
    margin: auto auto;
    background-image: url(http://cs-free.pl/images/army/ikony/tlosb.png);
    border-radius: 6px;
    margin-bottom: 20px;
    background-repeat: no-repeat;
    background-size: cover;
}
Odnośnik do komentarza
Udostępnij na innych stronach

  • Administrator

@Hity Internetu Jeśli wstawiasz do posta kod rób to za pomocą narzedzi:
image.png

1: Otwiera okno z kodem, wklejasz tam kod a nastepnie wybierasz jakiego typu jest to kod, np.: CSS lub HTML

2: Ukrywa sekcje przez co cały post nie jest wyyyyyyysoki.

Odnośnik do komentarza
Udostępnij na innych stronach

/* DVZ Shoutbox */
#shoutbox {
    width: 100%;
    margin: auto auto;
    background-image: url(http://cs-free.pl/images/army/ikony/tlosb.png);
    border-radius: 6px;
    margin-bottom: 20px;
    background-repeat: no-repeat;
    background-size: cover;
}
#shoutbox .head { padding: 8px; }
#shoutbox .head  { cursor: pointer; color:  #eee;padding: 21px;font-size: 15px;font-family: 'Encode Sans Expanded', sans-serif;text-transform:  unset;border-radius:  0;position:  relative;overflow: visible;}
#shoutbox .head:before {    content: "";    height:  2px;    width: 96%;    background: #;    bottom: 0;    display:  block;    position:  absolute;    left: 2%;}
#shoutbox .head:after {  content: "";   width: 150px;    height:  2px;    position:  absolute;    bottom: 0;    left: 2%;    background: #;}
#shoutbox .head .right { float: right; margin: 0; font-size: 13px; }
#shoutbox.collapsed .head { opacity: 0.9; }
#shoutbox.collapsed .body { display: none; }


#shoutbox .minposts, #shoutbox .blocked { padding: 6px; font-size: 13px; }
#shoutbox .panel.minposts { background: #FFFED8; color: #727250; }
#shoutbox .panel.blocked { background: #FCEFEF; color: #543A3A; }
#shoutbox .panel p { margin: 0; }


#shoutbox .data { display: table; width: 100%; font-size: 13px; }
#shoutbox.front .data { border-top: none; }
#shoutbox input.text {margin: 0;padding: 10px 2%;width: 96%;box-sizing: border-box;border: none;border: 1px solid #000;box-shadow: inset 0 2px 4px ;font-size: 13px;}
#shoutbox .entry {display: table-row !important;transition: background-color ;position:  relative;}
#shoutbox .entry:nth-child(even) { background-color: rgba(0,0,0,0.01); }
#shoutbox .entry.new { background-color: rgba(255,255,100,0.1); }
#shoutbox .entry:target { background-color: rgba(50,200,255,0.1); }
#shoutbox .entry > div { border-bottom: 1px solid #000;}
#shoutbox .entry:last-child > div { border-bottom: none; }
#shoutbox .window {overflow-y: scroll;);width: 96%;padding: 0 2%;}
#shoutbox .entry > div {display: table-cell;padding: 10px 3px;}

#shoutbox .avatar img { margin: 0 auto; vertical-align: middle; max-height: 20px; max-width: 20px; border: solid 1px rgba(255,255,255,0.1); box-shadow: 0 0 2px rgba(0,0,0,0.1); cursor: pointer; }

#shoutbox .user {  text-align: left; white-space: nowrap; font-size: 14px; }
#shoutbox .text { width: 100%; color: #b9b9b9; }
#shoutbox .info { font-size: 11px; color: #AAA; white-space: nowrap; text-align: right; }
#shoutbox .entry.unread .info:before { display: inline-block; position: relative; top: -2px; margin-right: 10px; height: 4px; width: 4px; content: ''; background: rgba(255,100,0,0.8); border-radius: 10px; }
#shoutbox .info a { color: inherit; }
#shoutbox .mod { padding: 6px 8px; font-size: 9px; font-weight: bold; color: #AAA; text-decoration: none; }
#shoutbox .mod:nth-of-type(2) { margin-right: 5px; border-left: solid 1px rgba(0,0,0,0.1); }
#shoutbox  .ip { margin-right: 10px; color: #;
	
		

Wiem tylko ze belka ma mieć klasę “headline”, a cały shoutbox “stable”.  Jak przerobić ten kod css zeby to wyglądało to jak Lista serwerów ?

blad2.png

Odnośnik do komentarza
Udostępnij na innych stronach

Problem wciąż nierozwiązany? Dodaj swoją odpowiedź

Jeśli chcesz dodać odpowiedź, zaloguj się lub zarejestruj nowe konto. Jedynie zarejestrowani użytkownicy mogą komentować zawartość tej strony.

Zarejestruj nowe konto

Załóż nowe konto. To bardzo proste!

Zarejestruj się

Zaloguj się

Posiadasz już konto? Zaloguj się poniżej.

Zaloguj się
 Udostępnij

×