joi, 14 aprilie 2011

Tutorial CSS

CSS in relatie cu HTML

Inainte de a continua si in cazul in care nu stapaniti HTML siXHTML va sfatuiesc sa cititi cele doua tutoriale.

Ce veti invata in acestTutorial CSS:

- cum sa scrieti corect cod CSS
- unde si cum trebuie plasat codul CSS
- sa faceti un layout, un meniu folosind CSS
- sa personalizezi campuri cu ajutorul CSS, si implicit formulare
- imagini transparente, galerie de imagini folosind CSS
- s.a.m.d.

Acestea fiind spuse va invit sa cititi in continuare tutorialul CSS

Introducere - De ce folosim CSS

Cu ajutorul CSS-ului putem crea pagini web simple dar si complexe folosind efecte diverse. Cu CSS putem stabili culoarea, marimea si fontul textului, deasemenea putem crea un layout (un suoport pentru elementele HTML) personalizat adaugand margine culoare sau imagine de fond si multe altele. In concluzie CSS te poate scapa de multe batai de cap, ajutandute in a mentine codul html cat mai simplu si mai ordonat.

Introducere - Ce este CSS - Generalitati

Cascading Style Sheets pe numele lui mic CSS se foloseste pentru a personaliza tagurile HTML..
In principiu HTML a fost conceput pentru a marca elementele unei pagini:

Odata cu introducerea HTML 3.2 au fost introduse si atributele de personalizare a tag-urilor precum "font", "color" etc. A fost atunci cand limbajul de programare HTML a devenit greoi. Fiecare pagina a websitului trebuia luata separat si modificate proprietatile elementelor principale.

Aceasta problema a fost rezolvata in versiunea 4.0 a HTML-ului. Toate atributele de personalizare au fost scoase si salvate intr-un fisier extern cu extensia ".css".

In felul acesta modificand un singur fisier putem schimba forma in care sunt afisate toate paginile unui website. Putem schimba culoarea textului, fontul, marimea, putem personaliza div-uri, formulare si multe altele.

Si cam atat despre ce face si ce este CSS-ul. In capitolul urmator vom trece la lucruri mai practice si vom invata cum anume sa facem tot ce am spus ca se poate face folosind CSS.

Comentarii

alina

Imi spuneti va rog ce cod trebuie sa contina o pagina simpla de css pe care sa o salvez cu .css pe notepad pe care apoi sa o pot folosi ca foaie externa sa puna culoarea de fundal pentru alte pagini? O pagina care se salveaza cu .CSS are doar elemente de CSS sau trebuie combinate cu HTML,salvat cu .CSS iar apoi facuta o alta pagina pentru legaturi? Pagina externa care contine link catre fisierul .CSS(si coduri HTML) trebuie salvata cu .CSS sau .HTML? Va multumesc.

18-Nov-2010 - 04:12

mandy

Nu prea inteleg tot dar incerc sa iti spun cat de cat. Deci,.... pagina salvata ca .css contine numai elemente css. Defapt css "aranjeaza" pagina html pe care o creezi tu, ii da font, culoare...... .Dar pagina html trebuie sa aiba link catre fisierul.css imediat dupa title. Pagina html poate sa contina si cod css. Codul css poate fi adaugat paginii tale in vreo 4 moduri, daca imi amintesc bine. Fii atenta la tutorialul asta la capitolul "Extern, intern sau inline". Acolo gasesti tot. Daca, chiar nu intelegi mai cauta o detaliere a introducerii codului css in html, dar eu zic ca in acest tutorial este suficient sa intelegi.

07-Dec-2010 - 05:35

Alex

Imi pare rau, dar nu m-am putut abtine. "limbajul de programare HTML". Stii de la ce vine HTML sau ce este HTML de fapt? Pentru ca nu este nici pe de parte un limbaj de programare, si nu te poti considera "programator" daca scrii html. E considerat bun simt sa stii despre ce vorbesti inainte sa scrii tutoriale despre asta.

19-Jan-2011 - 17:07

Tutoriale HTML

Am creat acest site detutoriale HTML pentru a invata programatorii principianti, dar si pe cei cu o oarecare baza in ce priveste libajul de programare HTML. Vei invata cum sa folosesti HTML pentru a realiza un website. Va invitam sa incepeti cursurile de programare intr-o secunda. Dar mai intai, "meniul"...

Ghidul Incepatorului in HTML - Pentru aceia dintre voi care sunt incepatori HTML si in crearea de pagini web folosind HTML. Acest limbaj de marcare sta la baza programari web. Toate sau aproape toate website-urile folosesc HTML-ul in constructia lor.

Tutorial Complet HTML - HyperText Markup Language sau pe scurt HTML. HTML a aparut ca o modalitate de a prezenta informatia structurata pe titluri paragrafe etc. Pentru a personaliza aceste elemente HTML va recomandam sa folositi CSS

Tutorial Complet XHTML - eXtensible HyperText Markup Language, sau pe numele lui mic XHTML, este o versiune mult mai stricta si mai curata a HTML.

Tutorial complet CSS - CSS este prescurtarea de la Cascading Style Sheets sau in traducere libera, foi de stil. Folosind CSS poti formata toate elementeleHTML fara a incarca prea mult documentul HTML. In acest fel vei minimiza timpul de incarcare (loading) si vei putea schimba infatisarea paginii modificand un singur fisier.

Html pe scurt

Am incercat mai jos sa fac o scurta lista cu cele mai folosite coduri HTML. Poti sa adaugi aceasta pagina la favorite pentru a avea la-ndemana acesta lista de coduri HTML atunci cand nu stii cum se formuleaza un anumit tag HTML sau pur sui simplu nu iti aduci aminte.

Html - Elemente

Principalele elemente in HTML sunt <html>, <head>, <title> si <body>. Iata si un exemplu simplu de construire a unei pagini HTML.

<html>
<head> 
<title>Prima mea pagina web folosind cateva coduri HTML!</title>
</head> 
<body> 
Salut Gasca! Aici voi pune mai tarziu continutul! Si voi realiza o pagina simpla folosind HTML 
</body> 
</html>

Html - Paragraf

<p>Acesta este un simplu paragraf in HTML</p>
<p align="left">Acesta este un paragraf aliniat la stanga</p>

Pe langa atributul align putem folosi pentru a alinia elementele HTML urmatoarele valori: left, right center si justify.

Html - Titluri

<h1>Acesta este tag-ul HTML pentru cel mai mare titlu</h1>

Alte tipuri de titluri in HTML: h2, h3, h4, h5, h6. Unde h1 este cel mai mare si h6 cel mai mic.

Html - Linebreak

<br /> este un salt in linie in HTML - spatiul intre br si slesh face diferenta intre cod valid XHTML si HTML 4.1 de exemplu.

Html - Line Orizontala

<hr /> se foloseste pentru a desena o linie orizontala in HTML - spatiul intre hr si slesh face diferenta intre cod valid XHTML si HTML 4.1 de exemplu..

Html - Liste

O lista simpla in HTML este de forma

<ol>
<li>Primul element HTML din lista </li>
<li>Al doilea element HTML din lista</li>
<li>Al treilea element HTML din lista</li>
</ol>

Lista de mai sus este o lista ordonata. Alte tipuri de liste in HTML sunt liste neordonata si lista de definitii.

Html - Link-uri

<a href="http://www.tutorialehtml.com/" title="HTML 5" target="_blank" >Html 5</a>
<a href="#top">Mergi la inceput</a> (<a name="top"></a>)
<a href="mailto:admin@exemplu.com" >Nelamuriri aici</a>
<a href="http://www.tutorialehtml.com/" title="HTML 5" target="_blank" ><img src="img/html_image.jpg" alt="HTML 5" /></a>

Au fost exemplificate mai sus un link normal in HTML, un link folosit pentru a lega doua sectiuni in aceasi pagina, un link email si un link imagine. Desi nu se mai foloseste in HTML dar merita mentionat.

<base href="http://www.tutorialehtml.com/">

Base href a fost scos din indexul tagurilor in HTML 5

Html - Imagini

<img src="img//html_image.jpg" alt="Html Image" width="100" height="50" align="center" />Va recomand alinierea cu ajutorul CSS. La fel si stabilirea dimensiunilor imaguinii. Ceea ce ar transforma codul HTML de mai sus in:
<img src="img//html_image.jpg" alt="Html Image" style="width:100px; height:50px; margin:auto;" />

Html - Formulare

Am adaugat mai jos codul HTML folosit pentru a crea un simplu formular. Acesta este doar formularul HTML folosit de user pentru a introduce informatia dorita. Nu uita ca pentru procesarea aceste informatii, odata ce se face click pe butonul submit al formularului HTML. Informatia va fi procesata de catre un fisier.php si eventual urcata in baza de date sau trimisa pe email.

<form method="post" name="formular" action="fisier_care_proceseaza_formularul_html.php">
.................campurile de text care vor prelua informatia.........
<input type="submit" value="Trimite">
<input type="reset" value="Sterge" />
</form>

Html - Campuri de text

Am atasat mai jos codurile HTML folosite pentru campuri de text in functie de cerinte.

<input type="text" size="10" maxlength="40" name="nume"> - camp de text normal
<input type="password" size="10" maxlength="10" name="parola"> - parola
<input type="radio" name="culoare" value="rosu"> - buton radio
<input type="checkbox" name="da" value="da"> - casuta de bifat
<select name="limbajdeprogramare">  - meniu drop-down
<option>Html 4.1</option> 
<option>Html 5</option> 
</select>

HTML - Tabele

Structura de baza a unui tabel in HTML este urmatoarea..

<table>
   <tr> 
      <th>Column 1</th>
      <th>Column 2</th>
   </tr>
   <tr>
      <td>Row 1 Cell 1</td>
      <td>Row 1 Cell 2</td>
   </tr>
   <tr>
      <td>Row 2 Cell 1</td>
      <td>Row 2 Cell 2</td>
   </tr>
</table>

Html - Bgcolor

Iata folosirea atributului bgcolor in HTML. Scopul lui este acela de a stabili o culoare de fond.

<body bgcolor="#efefef">
<div bgcolor="#888888">
<table bgcolor="#000000"> - etc.

Html - Background

Puntru a pune o imagine background vom folosi urmatorul cod HTML.

<table background="img/pattern.jpg">

Html - Comentarii

Html - Embed (Muzica)

Pentru a insera muzica intr-un document.html vom folosi folosi urmatorul randHTML.

<embed src="tu si tuborg.mp3" hidden="false" autostart="false" loop="false" volume="60" width="144" height="60" />

Html - Object (Video)

Pentru a insera un video intr-un document.html vom folosi urmatoarea bucata de cod HTML.

<object width="425" height="344">
<param name="movie" value="http://www.youtube.com/v/UAq8qHNWMNw&hl=en&fs=1"></param>
<param name="allowFullScreen" value="true"></param>
<embed src="http://www.youtube.com/v/UAq8qHNWMNw&hl=en&fs=1" type="application/x-shockwave-flash" allowfullscreen="true" width="425" height="344">
</embed>
</object>

Html- Text ingrosat (Bold)

<b>text ingrosat in html</b>
<strong>text ingrosat in html</strong>

Html - Text inclinat

<i>italic</i>
<em>emphasized</em>
<blockquote>blockquote</blockquote>
<address>address</address>

Html - Subscript, Superscript, Striketrough

<sub>indice!</sub>
<sup>exponential!</sup>
<del>text taiat</del>

In general aceste trei tag-uri HTML nu se folosesc prea mult dar merita amintite

HTML - Upload si Campuri ascunse

Exemplul de mai jos este campul folosit pentru a urca un fisier pe server. Tine minte ca este doar partea HTML a formularului.

<form method="post" action="fisier_care_proceseaza_formularul_html.php"> 
        <input type="hidden" name="MAX_FILE_SIZE" value="500" /> 
         <input type="file" />
<input type="submit" value="Trimite">
<input type="reset" value="Sterge" />
</form>

sâmbătă, 5 martie 2011

Metin2 NewWorld

Client Download : Click !!

Conturile se fac la id de mess : mt2.world
Sau trimiteti un email cu numele contului si parola la : mt2.world@yahoo.com

Site : Link

vineri, 4 martie 2011

Metin2

Client Download Click !
In Mc Adaugati 89.122.152.226
Conturile Se Fac La Id De Mess : al3x_2009_al3x
Deschis Azi 04.03.2011

joi, 3 martie 2011

Lopata De Zapada

Ce te faci daca iarna te-a luat prin surprindere si n-ai la-ndemana nici o lopata pentru indepartat zapada? Nu ..de ce sa te duci sa-ti cumperi? Mai bine improvizezi un sistem interesant de inlaturat zapada … de exemplu cum a facut nenea din aceasta poza.
Acum lucrurile decurg mai usor, iar zapada nu-ti mai este inamicul ‘nambar oan‘ ci conditia fizica.
lopata zapada