Navigare rapidă

Ultimele subiecte
» Ying-Yang Tutorial
Scris de Lucifer Mar 24 Apr - 11:34
» Avatar forumotion toolbar
Scris de Lucifer Mar 24 Apr - 11:33
» Salutare
Scris de Lucifer Mar 24 Apr - 11:32
» Avatar User in Online List
Scris de Emanueltutorials Vin 9 Feb - 21:18
Cuvinte-cheie

edit  

Ce este css?


CSS - Cascading Style Sheets ( Foi de Stil in Cascada ) aduce un control sporit tag-urilor HTML oferind o imbunatatire a prezentarii paginilor web, a designului.

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 transparentNu se pote personaliza la acest cod.
width: #px;Latime Tabel Modificati # la o valoare de cifre mai mare (ex:10,11,12)
height: #pxInaltimea 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 tabelModificati # 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.

Comentariile utilizatorilor
Membru ET
la data de Vin 27 Mai - 16:59
George130 Membru ET
Conectat
Foarte frumos şi folositor în acelaşi timp apreciez faptul că este făcut de tine.

Ţine-o tot aşa! :fericit:
Membru ET
avatar
la data de Vin 27 Mai - 18:41
Sweet Membru ET
Conectat
George, totul de pe acest forum este original


$tefaN, foarte frumos tutorialul, chiar imi trebuia
Membru ET
avatar
la data de Sam 28 Mai - 10:51
Venom Membru ET
Conectat
Foarte bun tutorialul. Mai ales pentru incepatori. Tine-o tot asa
Vizitator
avatar
la data de Sam 28 Mai - 11:08
Vizitato Vizitator
Conectat
Bun tutorial, respect munca ta!
Membru ET
avatar
la data de Mar 27 Sept - 21:02
denisdeni22 Membru ET
Conectat
Imi pare foarte bine ca am gasit asa ceva
Membru nou
avatar
la data de Mier 28 Sept - 15:26
TROJANU4U Membru nou
Conectat
Foarte frumos...
Membru dedicat
la data de Mier 28 Sept - 20:19
Keir Membru dedicat
Conectat
TROJANU4U te-aş ruga să comentezi de acum în minim 3 cuvinte pentru ca altfel, conform regulamentului, se consideră spam. Mulţumesc pentru înţelegere!
Membru dedicat
avatar
la data de Dum 2 Oct - 23:28
Paul Membru dedicat
Conectat
Bun tutorial
Bravo asa mai invatam lucruri noi..