Liste HTML

Listele in HTML poate fi ordonate, neordonate, de definitie.

I. Liste neordonate (Eticheta

    ):
    ====================
    Listele neordonate se marcheaza intre
    . Fiecare element este marcat prin eticheta
  • Deschideti editorul de text (notepad, etc.. ) si salvati urmatoarul cod HTML sub denumirea liste1.html

    Lista de cumparaturi:

    • pasta de dinti
    • harta Romania
    • apa plate

    Dupa ce ati salvat fisierul liste1.html, deschideti cu browser si veti vedea rezultatul.

    II. Liste ordonate (Eticheta

      ):
      ====================
      Listele neordonate se marcheaza intre
      . Fiecare element este marcat prin eticheta
    1. Deschideti editorul de text (notepad, etc.. ) si salvati urmatoarul cod HTML sub denumirea liste2.html

      Lista de cumparaturi:

      1. pasta de dinti
      2. harta Romania
      3. apa plate

      Dupa ce ati salvat fisierul liste2.html, deschideti cu browser si veti vedea rezultatul.

Tabele HTML – Crearea si formatarea tabelelor

Tabele sunt utilizate pentru a afisa o informatie intr-o forma foarte clara. In acest exemplu voi arata cum se creaza un tabel in HTML.

Etichetele HTML al unui tabel:

– marcheaza inceputul tabelului

– marcheaza un rand nou (fiecare tabel trebuie sa contina cel putin un rand si o coloana!)

– marcheaza sfarsitul coloanei

– marcheaza sfarsitul randului

– marcheaza o coloana noua

– marcheaza sfarsitul tabelului

Atributele etichetelor (cele mai des folosite):

In final editez un orar in HTML, ideal pentru elevi! :

ORAR LUNI MARTI MIERCURI JOI VINERI
7-8 Romana Engleza Matematica Sport Franceza
8-9 Matematica Sport Franceza Romana Engleza
9-10 Engleza Romana Sport Franceza Matematica
10-11 Sport Matematica Franceza Romana Engleza

Bafta!!!
Echipa Tutoriale PHP (HTML)

Problema DIV Height in Mozilla

Fie urmatorul cod:

#page{
width:980px;
background-color:#000;
}

#left{
float:left;
width:180px;

}

#right{
float:right;
width:800px;
}

lorem ipsum…
lorem ipsum…
lorem ipsum…
lorem ipsum…
right lorem ipsum…

avem surpriza neplacuta ca in mozilla inaltimea div-ului #page este de vreo 20 px si culoarea fundalului se pastreaza pe 20px ….

Acest bug se poate corecta ca inaltimea divului #page sa fie dinamic prin adaugarea urmatorului cod:

overflow:hidden;

Si in cod vom avea:

#page {
overflow:hidden;
width:980px;
background-color:#000;
}

Daca testam vom observa ca inaltimea divului #page se lungeste automat!

Introducere in HTML

Introducere in HTML

Exemplu

Prima pagina mea HTML

Primul meu paragraf.

Ce este HTML?

HTML este un limbaj pentru a descrie paginile web.

– HTML : H yper T ext M arkup L anguage
– HTML nu este un limbaj de programare, este un limbaj de marcare.
– Un limbaj de marcare este alcatuit dintr-un set de etichete de marcare
– HTML utilizează etichete de marcare pentru a descrie paginile web

Etichete HTML

Etichetele HTML sunt, de obicei, denumite tag-uri HTML

– Tag-uri HTML sunt cuvintele-cheie, inconjurata de paranteze ca
– Tag-uri HTML venit în mod normal, in perechi, precum si
– Primul tag-ul intr-o pereche de tag-ul este la inceput, cel de-al doilea tagl este sfârsitul tag-ului

Documente HTML = Pagini Web

– Documente HTML descrie pagini web
– Documentele HTML contin tag-uri HTML si text simplu
– Documentele HTML sunt, de asemenea, numite pagini web

Scopul un browser Web (cum ar fi Internet Explorer sau Firefox) este de a citi documente HTML si a le afisa ca paginia de web. Browser-ul nu se afiseaza in tag-uri HTML, dar foloseşte tag-uri pentru a interpreta continutul paginii:

Selectarea informatiilor dintr-un tabel MySQL

Selectarea informatiilor dintr-un tabel MySQL se face prin comanda : SELECT

Structura unei interogari MySQL:

SELECT camp1, camp2 FROM nume_tabel

Se pot selecta anumite campuri din tabel specificand numele campurilor separate prin virgula sau toate campurile folosind simbolul *

ex: SELECT * FROM tabel1 – selecteaza toate informatiile dintr-un tabel.

In cazul in care avem un tabel cu multe inregistrari putem sa specificam in interogare pozitia si numarul de inregistrari.

Structura: SELECT * FROM tabel1 LIMIT pozitia, nr_elemente

ex: SELECT * FROM tabel1 LIMIT 3, 5 – selecteaza inregistrarile pornind de la al 3lea inregistrare si ne va returna 5 inregistrari.

Putem sa ordonam in ordine alfabetica un tabel:

Structura:

SELECT * FROM tabel1 ORDER BY campul_dorit ASC – ordoneaza crescator / ordine alfabetica

SELECT * FROM tabel1 ORDER BY campul_dorit DESC – ordoneaza descrescator

Si un ultim exemplu global, avem un tabel (utilizatori):

nume | varsta |
—————
ion | 12 |
—————
ana | 14 |
—————
paul | 13 |

si dorim sa afisam toti utilizatorii din acest tabel, daca au peste 12 ani …

ex: SELECT * FROM utilizatori WHERE varsta > 12

dorim ca aceste inregistrari sa fie ordonate alfabetic:

ex: SELECT * FROM utilizatori WHERE varsta > 12 ORDER BY nume ASC

Introducere in MySQL

MySQL este un sistem de gestiune a bazelor de date relational, produs de compania suedeza MySQL AB si distribuit sub Licenta Publica Generala GNU. Este cel mai popular SGBD open-source la ora actualaă, fiind o componenta cheie a stivei LAMP (Linux, Apache, MySQL, PHP).Desi este folosit foarte des impreuna cu limbajul de programare PHP, cu MySQL se pot construi aplicaţii în orice limbaj major.

Mysql poate sa contina mai multe baze de date. Fiecare baza de date contine tabele. Fiecare tabel are minim 1 camp. In majoritatea cazurilor folosim un camp index ( cheie primara ) pentru a cauta o anumite informatie intr-un tabel.

Exemplu tabel “utilizatori”:

——————————
id | nume | email |
——————————
1 | ionel | i@k.ro |
——————————
2 | vasile | v@k.ro |
——————————
3 | paula | p@k.ro |
——————————

Fiecare camp al unui tabel are specificat tipul de date. Ex:

id = INT – numar intreg
nume = VARCHAR 40 – 40 de caractere ( putem specifica un numar mai mare de caractere)
email = VARCHAR 60 – 60 de caractere

Se mai folosesc foarte des urmatoare tipuri de date:

DATE – format data
TEXT – pentru texte foarte lungi

Va recomand folosirea versiunii MySQL 5 cu interfata de administrare PHPMYADMIN. Cu ajutorul PHPMYADMIN este posibila administrarea foarte usoara a bazelor de date fara a avea cunostinte avansate.

Pentru a lucra cu o baza de date trebuie sa ne conectam la acesta. Pentru a se conecta la o baza de date avem nevoie de o parola si utilizator. Toate bazele de date sunt parolate ca sa nu aiba acces oricine.

Selectii – Selectii cu valori implicite 2

Voi continuea exemplele cu selectii. La o selectie varsta e foarte simpla treaba, avem de la o varsta pana la o alta varsta valori numerice. Problema este urmatoarea: ce facem cand vrem sa realizam o selectie de judete, cu un judet selectat implicit!?

In acest caz se procedeaza in felul urmator:
1. Creeam un vector in care elementele sunt numele judetelor
2. Parcurgem cu instructiunea FOR toate elementele
3. Verificam daca am ajuns la judetul selectat!

Acest pasi concretizam in exemplul urmator:
<?php

$judete = array ("Alba",
"Arad",

"Bihor",
….
"Vaslui",
"Bucuresti");

$judetul_selectat = "Vaslui";

//salvam intr-o variabila numarul judetelor ( numarul elementelor din vector ) cu ajutorul functiei count($vector);

$nr_judete = count($judete);

echo "”;

for($i=0; $i<$nr_judete; $i++){
$selected = "";
if ($judete[$i] == $judetul_selectat) $selected = "SELECTED";
echo "”.$judete[$i].””;

}

echo “”;

?>

Selectii – Selectii cu valori implicite 1

Voi prezenta cateva exemple de selectii realizand cu ajutorul limbajului PHP.

Structura etichetei selectie in HTML:

OPTIUNE1
OPTIUNEA SELECTATA IMPLICIT
OPTIUNE 3

Dorim sa realizam un camp de selectie unde utilizatorul poate sa-si alege varsta, numarul 18 sa fie valoare implicita! In mod normal in HTML ar trebui trecut urmatorul cod:

15
16
17
18



59
60

In PHP putem realiza mult mai simplu, si anume:
<?php

echo "”;

$varsta_minima = 15;
$varsta_maxima = 60;
for ($i=$varsta_minima; $i<=$varsta_maxima; $i++){
echo "$i”;
}

echo “”;

?>

Si ca sa avem si optiune implicita trebuie sa modificam acest cod in felul urmator:
<?php

echo "”;

$varsta_minima = 15;
$varsta_maxima = 60;
$varsta_implicita = 18;

for ($i=$varsta_minima; $i<=$varsta_maxima; $i++){
$selected = "";
if($i == $varsta_implicita) $selected = "SELECTED";
echo "$i”;
}

echo “”;

?>

Headere Randomizate – Aleatorii pentru site

In acest exemplu vom prezenta modalitatea de a avea header interactiv care se schimba la fiecare refresh. Nu este foarte complicat, in schimb poate fi foarte util si in acelasi timp si distractiv.

Cum arata fisierul nostru header.php

<?php

//fisierele le salvam in vectorul $poze_header

$poze_header[0] = "header1.jpg";
$poze_header[1] = "header2.jpg";
$poze_header[2] = "header3.jpg";
$poze_header[3] = "header4.jpg";

//urmeaza randomizarea si afisarea:
//se alege o poza de la 0-3 (pozitiile la vectori incep de la 0 )

$pozitie = rand(0,3);
echo "“;

?>

Acesta va afisare in mod aleatoriu cele 4 poze, schimband la fiecare refresh.