HTML : Poate fi utilizate in moduri diferite dar sub aceias actiune.Mai jos se afla un exemplu de coduri scurte care executa aceias actiune de modificare.
Varianta 1:
#clasa{ valoarea dorita}
Cod:
<div id="clasa">CONTINUT</div>
Varianta 2:
.clasa{ valoarea dorita}
Cod:
<div class="clasa">CONTINUT</div>
Cod:
<span class="clasa">CONTINUT</span>
Cascading Style Sheets (CSS): este cea mai importanta ramura a paginilor web.
Toate codurile css functioneaza cu cuvinte din limba engleza si daca stim minimul de engleza vom crea cate coduri dorim.
Dictionar pentru modificarea textelor:
font-size: #px; | Marimea Textului | Modificati valoarea #px in or care alta valoare 7px,8px...etc. |
font-family: Verdana; | Fontul Textului | Inlocuiti Verdana cu orcare alt font care va place. |
color: #000000; | Culoarea textului | Modificati #000000 cu alt cod pentru culori html. |
font-weight: bold; | Utilizare bold la text | Aici nu se pot face modificari . |
Acestea 4 sunt cele mai importante si cele mai utilizate valori css.
Dictionar pentru modificarea tabelelor:
background-color: transparent; | fundal transparent | Nu se pote personaliza la acest cod. |
width: #px; | Latime Tabel | Modificati # la o valoare de cifre mai mare (ex:10,11,12) |
height: #px | Inaltimea | Modificati # la o valoare de cifre mai mare (ex:10,11,12) |
background-color: #; | Fundal Tabel | Modificati # cu ajutorul codurilor de culori html. |
border-radius: #px; | Rotunjite tabel | Modificati # la o valoare de cifre mai mare (ex:5,6,7) |
padding: #px; | Distanta dintr-e text si tabel . | Modificati # la o valoare de cifre mai mare (ex:1,2,3) |
background-repeat: no-repeat; | Fundal fara reperater | Nu se pote personaliza la acest cod. |
border:#px; | Contur tabel | Modificati # la o valoare de cifre mai mare (ex:1,2,3) |
background: url(LINK IMAGINE) ; | Fundal cu o imagine. | Modificati LINK IMAGINE cu o imagine incarcata pe un host de imagini. |
Pentru a crea codul nostru personalizat adaugati css in pagina html in tagul html:
Cod:
<style type="text/css">CODURI CSS</style>
Am creat o structura pentru a va da seama despre cum ar trebui asezate intro pagina html.
Cod:
<style type="text/css">#nume_clasa {
background-color: #f3f3f3;
border-radius: 4px;
border:1px;
}</style>
<div id="nume_clasa">Ana are mere.</div>
In acest tutorial am dat exemple de structura unui css. In urmatorul tutorial voi vorbi mai mult despre cum creati un astfel de cod.
Tutorial creat de $tefaN - Nu este permisa distribuirea pe alte site-uri.
Ţine-o tot aşa! :fericit:
George130Vin 27 Mai - 16:59