Skocz do zawartości

  • 👋 Witaj na MPCForum!

    Przeglądasz forum jako gość, co oznacza, że wiele świetnych funkcji jest jeszcze przed Tobą! 😎

    • ✅ Pełny dostęp do działów i ukrytych treści
    • ✅ Możliwość pisania i odpowiadania w tematach
    • ✅ System prywatnych wiadomości
    • ✅ Zbieranie reputacji i rozwijanie swojego profilu
    • ✅ Członkostwo w jednej z największych społeczności graczy

    👉 Dołączenie zajmie Ci mniej niż minutę – a zyskasz znacznie więcej!

    Zarejestruj się teraz

My Anime List - CSS :3

sebasku

Przez sebasku
w Anime

Rekomendowane odpowiedzi

sebasku Pasjonat

sebasku

Opublikowano
Pasjonat

sebasku

Opublikowano

Witam,
Mam kilka pytań odnośnie mojego kodu i powiem co chciałbym zmienić i miałbym prośbę, żeby mi którykolwiek z Was wyjaśnił co muszę zmienić by uzyskać dany efekt ;)
Zaczynając, chciałbym powiększyć(rozszerzyć) tą rubrykę(czarny) i ogólnie tabelkę rozszerzyć(czerwony): SS

http://scr.hu/2yn3/0z3wt

Tutaj jest mój CSS code:

 

@Import url(http://fonts.googleapis.com/css?family=Nova+Slim);

 
/*
BACKGROUND IMAGE
This is the main background image for the whole page.
Change the image link to the background you want!
For more help on changing out images see here:
*/
body {
background-attachment: fixed;
background-image: url("http://i.imgur.com/hCVyw.jpg");
background-position: center center !important;
background-size: cover;
font-family: Nova Slim !important;
font-style: inherit !important;
font-variant: inherit !important;
text-decoration: none !important;
}
/*
HEADERS
C.C. headers.
For tutorial on changing the images out see here:
*/
.header_cw {
background: url("http://i.imgur.com/W4ubO.png") no-repeat scroll 0 0 transparent;
}
.header_completed {
background: url("http://i.imgur.com/s8lSU.png") no-repeat scroll 0 0 transparent;
}
.header_onhold {
background: url("http://i.imgur.com/qlpXr.png") repeat scroll 0 0 transparent;
}
.header_dropped {
background: url("http://i.imgur.com/rmN9U.png") no-repeat scroll 0 0 transparent;
}
.header_ptw {
background: url("http://i.imgur.com/wbQ6I.png") no-repeat scroll 0 0 transparent;
}
 
/*
TITLE BAR MESSAGE
The message at the top bar of the screen, change it after 'content' in the quotations below. 
By default I have it say "Welcome on my Anime List!"
*/
#mal_cs_powered:before {
content: "Welcome on my Anime List" !important;
}
 
/*
HOVER IMAGE
The glow that appears when you hover over an image.
*/
a:hover, a hover span {
background: url("http://i.imgur.com/G8ZGY.png") repeat-x scroll 0 0 transparent;
color: lightgreen;
}
 
/*
CATEGORY LINK MENU
The codes for the category menu on the right side. 
More info on changing category links here: 
*/
#list_surround .status_selected {
background: url("http://i.imgur.com/X4WAB.png") no-repeat scroll 0 0 transparent;
display: block;
height: 40px;
margin-right: 20px;
padding: 0;
position: fixed;
right: 0;
top: 40px;
width: 175px;
}
#list_surround .status_selected a {
color: transparent;
display: block;
font-family: Nova Slim;
font-size: 1px;
font-weight: lighter;
padding: 40px 0 0 175px;
width: 0;
}
#list_surround .status_not_selected {
background: url("http://i.imgur.com/X4WAB.png") no-repeat scroll 0 0 transparent;
display: block;
height: 40px;
padding: 0;
position: fixed;
right: 0;
top: 40px;
width: 175px;
}
#list_surround .status_not_selected a {
color: transparent;
display: block;
font-family: Nova Slim;
font-size: 1px;
font-weight: lighter;
padding: 40px 0 0 175px;
width: 0;
}
#list_surround .status_selected + .status_not_selected, #list_surround .status_not_selected + .status_selected, #list_surround .status_not_selected + .status_not_selected {
background: url("http://i.imgur.com/FFqwG.png") no-repeat scroll 0 0 transparent;
display: block;
right: 1px;
top: 80px;
}
#list_surround .status_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected {
background: url("http://i.imgur.com/PLu4m.png") no-repeat scroll 0 0 transparent;
display: block;
right: 1px;
top: 120px;
}
#list_surround .status_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected {
background: url("http://i.imgur.com/p3bhb.png") no-repeat scroll 0 0 transparent;
display: block;
right: 1px;
top: 160px;
}
#list_surround .status_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected {
background: url("http://i.imgur.com/9JPPJ.png") no-repeat scroll 0 0 transparent;
display: block;
right: 1px;
top: 200px;
}
#list_surround .status_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected {
background: url("http://i.imgur.com/44Bxr.png") no-repeat scroll 0 0 transparent;
display: block;
right: 1px;
top: 240px;
}
 
/*
OTHER CODES
To replace the green graphics of the list on the layout, find replace the image URLs below with your own original list graphics. 
*/
 
#mal_cs_listinfo a {
font-family: Nova slim !important;
}
#mal_cs_listinfo a strong {
font-family: Nova slim !important;
}
#mal_cs_links a {
font-family: Nova slim !important;
}
#mal_cs_otherlinks a {
font-family: Nova slim !important;
}
#mal_cs_otherlinks strong {
font-family: Nova slim !important;
}
#mal_cs_otherlinks strong a {
font-family: Nova slim !important;
}
#mal_cs_powered {
background: url("") no-repeat scroll right center transparent !important;
color: lime !important;
height: 30px !important;
line-height: 30px !important;
margin-right: -466px !important;
padding: 0 0 0 13px !important;
position: fixed !important;
right: 50% !important;
text-align: left !important;
top: 0 !important;
width: 627px !important;
}
#mal_cs_powered img {
display: none !important;
}
#mal_cs_powered #search {
height: 17px !important;
left: 15% !important;
;
position: fixed !important;
top: 64px !important;
width: 164px !important;
}
#mal_cs_powered #search input {
background: none repeat scroll 0 0 darkgreen !important;
color: lime !important;
height: 17px !important;
opacity: 0.75 !important;
padding: 0 5px !important;
width: 154px !important;
}
#mal_cs_powered #search img {
display: none !important;
}
.header_cw, .header_completed, .header_onhold, .header_dropped, .header_ptw {
color: transparent;
height: 180px;
margin-top: 52px;
width: 450px;
}
#grand_totals {
background: url("http://i.imgur.com/WWfBj.png") no-repeat scroll 0 0 transparent;
color: white;
}
.td1, .td2 {
background: url("http://i.imgur.com/WWfBj.png") repeat scroll 0 0 transparent;
}
.category_totals {
background: url("http://i.imgur.com/WWfBj.png") repeat scroll 0 0 transparent;
color: white;
}
.header_title a {
color: transparent !important;
}
a, a:visited {
color: lightgreen;
text-decoration: none;
}
.animetitle, .animetitle:visited {
color: lime;
}
#list_surround {
background: none repeat scroll 0 0 transparent;
position: absolute;
right: 229px;
top: -18px;
width: 450px;
}
.table_header {
background: url("http://i.imgur.com/WWfBj.png") repeat scroll 0 0 transparent !important;
color: teal !important;
}
a.thickbox {
color: lime;
}
#list_surround br {
display: inline-block;
}
#copyright {
background: url("http://i.imgur.com/WWfBj.png") no-repeat scroll 0 0 transparent;
color: white;
}
#copyright br {
display: inline-block;
text-align: center;
}
#copyright:after {
content: " Custom CSS by Miketsukami-kun. Edits by Sebasku. ";
}
 
# {
background: url("http://i41.tinypic.com/27ymu5s.jpg") repeat scroll left center transparent !important;
position: fixed;
top: 0 !important;
z-index: 32;
}
 
# a {
color: lime !important;
text-decoration: none !important;
}
 
# a:hover {
color: lime !important;
text-decoration: underline !important;
}

 
@
Dobra już się sam z tym uporałem, można na razie zamknąć ;)

graphic.png

-Vasto- Mentor

-Vasto-

Opublikowano
Mentor

-Vasto-

Opublikowano

A nie lepiej ci po prostu wpisać w googla MyAnimeList skins i tam masz tutoriale, skiny wszystko.

Raczej wątpię aby ktoś tutaj był tak obeznany w kodach i jeszcze tak chaotycznie podanymi.

NJxbd4x.png

Zarchiwizowany

Ten temat przebywa obecnie w archiwum. Dodawanie nowych odpowiedzi zostało zablokowane.

Tematy
×
×
  • Dodaj nową pozycję...