Nu sunteti conectat. Conectati-va sau inregistrati-va

Personalizarea background-ului si a conturului


1 Personalizarea background-ului si a conturului la data de Sam Apr 02, 2011 9:02 pm


Vizitato
Vizitator

1.Pentru a adauga proprietati background-ului folosim clasa CSS: body.

Putem adauga un background format dintr-o culoare:

Cod:
body{
background-color: #CULOARE;
}


...dintr-o imagine:

Cod:
body{
background-image: url(LINK IMaGINE);
}


..sau ambele:

Cod:
body{
background:#CULOARE url(LINK IMaGINE);
}


De asemenea putem modifica pozitia background-ului in caz ca dorim un background imagine si culoare:

Cod:
body{
background: #CULOARE url(LINK IMaGINE);
background-position: bottom center;
}


..sau o putem face sa se repete daca dorim sau nu adaugand:

Cod:
body{
background: #CULOARE url(LINK IMaGINE);
background-position: bottom center;
background-repeat: no-repeat;
}


Cod:
body{
background: #CULOARE url(LINK IMaGINE);
background-position: bottom center;
background-repeat: repeat-x;
}


Cod:
body{
background: #CULOARE url(LINK IMaGINE);
background-position: bottom center;
background-repeat: repeat-y;
}


2. Pentru a personaliza conturul forumului dvs. folosim clasa .bodyline

Putem creea un border :

Cod:
.bodyline{
border: 1px solid #CULOARE;
}


info:
Puteti inlocui 1px cu 2px , 3px s.a.m.d.


..Pentru background:

Cod:
.bodyline{
border: 1px solid #CULOARE;
background: CULOARE;
}


..pentru a face colturile (alea patratoase) ceva mai atragatoare (adica sa le rotunjim):

Cod:
.bodyline{
border: 1px solid #CULOARE;
background: #CULOARE;
border-radius: 5px;
-moz-border-radius: 5px;
-web-kit-border-radius: 5px;
}


Si pentru final am pastrat cel mai bun cod
Si anume acela de a adauga o umbra la conturul forumului

Cod:
.bodyline{
border: 1px solid #CULOARE;
background: #CULOARE;
border-radius: 3px;
-moz-border-radius: 3px;
-web-kit-border-radius: 3px;
-moz-box-shadow: 0 0 4px #CULOARE;
-webkit-box-shadow: 0 0 4px #CULOARE;
box-shadow: 0 0 4px #CULOARE;
}


3. Informatii:

Inlocuiti #CULOARE; cu culorea dorita de exemplu: #C7C7C7;

Tutorial propus de Emanuel - Reproducerea/Postarea acestui tutorial nu este permisa fara acordul postatorului.

2 Re: Personalizarea background-ului si a conturului la data de Sam Apr 23, 2011 12:50 pm


Vizitato
Vizitator

Stiam asta, dar oricum, buna lectie.

3 Re: Personalizarea background-ului si a conturului la data de Lun Iul 25, 2011 5:47 pm


Membru ET
Vezi profilul utilizatorului

Tutorialele sunt pentru incepatori.nu pentru cei care deja stiu.nu te supara.dar nu cred ca trebuia sa spui ca stiai dar e bun tutorialul.baga-te profesor daca tot spui ca sti...... bla bla bla

Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum