Tema Proiect HTML CSS JavaScript

Download Tema Proiect HTML CSS JavaScript

Post on 27-Feb-2018

213 views

Category:

Documents

0 download

Embed Size (px)

TRANSCRIPT

<ul><li><p>7/25/2019 Tema Proiect HTML CSS JavaScript</p><p> 1/3</p><p>Tema proiect HTML + CSS + JavaScript</p><p>1) HTML (10p)</p><p>In cazul in care lucrati 2 colegi la un proiect creati folderulNume1Prenume1_Nume2Prenume2, iar in</p><p>acest folder fisierele (text) index.html, pagina1.html, pagina2.html. Pagina index.html va fi pagina deprezentare, in principiu cea care se deschide la accesarea site-ului, celelalte doua pagini vor trata douasubiecte de interes la alegere (istorie, geografie, arhitectura, plante, animale, calculatoare, literatura,</p><p>cinematografie, sport, stiri, stiinta, hobby-uri, turism)In cazul in care lucrati singuri la proiect folderul se va numiNumePrenume</p><p>Veti adauga in acest folder orice alte fisiere (imagini, s.a. ) de care veti avea nevoie.</p><p>Pentru a inlatura orice confuzie,NumePrenume, Nume1Prenume1, Nume2Prenume2reprezinta nume</p><p>le si prenumele reale, conform carora se va face identificarea si notarea. ( Umorul utilizat in exces in</p><p>acest caz ar putea avea rezultate neprevazute)</p><p>Daca simtiti nevoie sa dati explicatii suplimentare sau sa faceti precizari legate de modul in care ati</p><p>realizat tema adaugati acestea intr-un fisier Readme.txt sau readme.doc in acest folder.</p><p>Predarea proiectului se va face prin trimiterea pe mail a folderului completat si arhivat in format</p><p>.zip sau .rar</p><p>CERINTE:</p><p>Cele trei pagini html vor avea urmatoarele elemente commune in :</p><p>Un antet continand descrierea paginii sau un mesaj de bun venit. (indicatie: se poate folosi tagul de</p><p>sectiune (division) si eventual un id pentru delimitarea acestuia).</p><p>Un meniu de navigare continand link-urile catre cele trei pagini asezae pe acelasi rand, separate</p><p>prin |.</p><p>O sectiune ( cu id de ex main) cu continutul principal al paginii.</p><p>Un footer ( cu id de ex f1) cu continut de genul Copyright FSA gr.1331 2015.</p><p>Continutul principal conditii minime pentru fiecare din cele trei pagini:</p><p>a. index.html va trebui sa contina un paragraf cu o scurta descriere a site-ului., un logo sau o</p><p>imagine si cateva link-uri catre site-uri de interes (la alegere)</p><p>b.</p><p>pagina1.html va trata unul din subiectele la alegere, va avea continutul organizat in catevaparagrafe, cu folosirea a cel putin doua tipuri de haedere interne, va contine cel putin o lista si</p><p>doua imagini color.</p><p>c. pagina1.html va trata cel de-al doilea subiect la alegere, organizarea acestuia fiind ca si pentru</p><p>prima pagina, in loc de lista va contine cel putin un tabel.</p></li><li><p>7/25/2019 Tema Proiect HTML CSS JavaScript</p><p> 2/3</p><p>2)</p><p>CSS (10p)</p><p>Creati in folderul mentionat fisierele stil1.css, stil2.csssi folositi-le pentru a modifica componentele de</p><p>baza ale celor trei pagini astfel:</p><p>stil1.css - Antetul va primi culoarea de fundal = culoarea 1 din schema 1, meniul de navigare culoarea de</p><p>fundal =culoarea 2 din schema 1, sectiunea principal culoarea 3, iar footerul culoarea 4 Culoarea textului</p><p>si fonturile le veti allege pentru a asigura vizibilitatea si o oarecare estetica a paginii.</p><p>stil2.css la fel ca pentru stil1.css, cu folosirea insa a schemei 2 de culori conform descrierii de mai jos:</p><p>Schemele de culori pe care le veti folosi vor fi urmatoarele:</p><p>Culoare 1 Culoare 2 Culoare 3 Culoare 4</p><p>Schema 1 #DD3784 #7A005C #BC008D #DD64BF</p><p>Schema 2 #FF8240 #A63A00 #FF5900 #FFA743</p><p>Schema 3 #FFC340 #A67100 #FFAE00 #FFD373</p><p>Schema 4 #6 A4BD07 #200772 #3914AF #876ED7</p><p>Schema 5 #3C9DD0 #034569 #0B6CA2 #64AAD0</p><p>Schema 6 #39E639 #008500 #00CC00 #67E667</p><p>Schema 7 #C7F83E #739D00 #B1F100 #D4F870</p><p>Schema 8 #FFEC40 #A69500 #FFE500 #FFF573</p><p>Schema 9 #FFBD70 #A66D00 #FFA700 #FFCF73</p><p>Modul in care le veti folosi va fi urmatorul:</p><p>-</p><p>Reduceti la o cifra data nasterii fiecaruia prin adunarea repetata a cifrelor ( de ex 210619922 +</p><p>1 + 0 + 6 + 1+ 9 + 9 + 2 = 30 3 +0 =3 sau 2212199329112). In cazul in care sunteti 2</p><p>pe proiect una dintre schemele obtinute va fi cea corespunzatoare uneia dintre cifre, cealalta celeide-a doua cifre daca ele coincid alegeti o alta schema dupa preferinte pe post de schema 2. In</p><p>cazul in care lucrati singur la proiect alegeti o a doua schema diferita de cea corespunzatoare</p><p>cifrei natale cum doriti.</p><p>3)</p><p>JavaScript (10p)</p><p>Creati in folderul mai sus mentionat fisierul scripturi.jspe care il veti folosi pentru a realiza</p><p>urmatoarele modificari:</p><p>Modificati meniul de navigare comun celor trei pagini organizandu-l ca lista neordonata, dispusa</p><p>orizontal. Modificati scriptul stil1.css pentru ca aceasta lista sa apara in asa fel incat sa dea</p><p>senzatia unui meniu:</p></li><li><p>7/25/2019 Tema Proiect HTML CSS JavaScript</p><p> 3/3</p><p>Adaugati un buton in sectiunea de antet si codul necesar astfel incat la apasarea butonului sa se</p><p>modifice culoarea de fundal a sectiunii principale (intr-o culoare la alegere, fixa sau a unei alte</p><p>sectiuni)</p><p>4)</p><p>Bonusuri (10p)</p><p>Utilizati JavaScript pentru ca atunci cand plasati cursorul mouse-ului pe una dintre imaginile</p><p>prezente in site (una singura, la alegere) sa apara imaginea respectiva in alb-negru, iar la iesirea</p><p>cursorului de pe imagine sa se revina la imaginea initiala color (5p)</p><p>Utilizati JavaScript si un eveniment (la alegere, pe oricare dintre pagini) pentru a rearanja cele 4</p><p>sectiuni din plasand antetul in partea stanga a sectiunii principale, deci facand sa apara 2</p><p>coloane deasupra footer-ului (5p).</p></li></ul>