Scribd Logo
Încărcați

Bine ați venit la Scribd!

  • Tema Proiect HTML CSS JavaScript

    Încărcat de

    StelyTzzu Best StelyTzzu
    606 vizualizări3 pagini
    Tema proiect programare web

    Drepturi de autor

    © © All Rights Reserved

    Formate disponibile

    PDF, TXT sau citiți online pe Scribd

    Vi se pare util acest document?

    Este necorespunzător acest conținut?

    Raportați acest document
    Tema proiect programare web

    Drepturi de autor:

    © All Rights Reserved
    Descărcați ca PDF, TXT sau citiți online pe Scribd
    Indicator pentru conținut neadecvat
    606 vizualizări3 pagini

    Tema Proiect HTML CSS JavaScript

    Încărcat de

    StelyTzzu Best StelyTzzu
    Tema proiect programare web

    Drepturi de autor:

    © All Rights Reserved
    Descărcați ca PDF, TXT sau citiți online pe Scribd
    Indicator pentru conținut neadecvat
    din 3

    Tema proiect HTML + CSS + JavaScript

    1) HTML (10p)
    In cazul in care lucrati 2 colegi la un proiect creati folderul Nume1Prenume1_Nume2Prenume2, iar in
    acest folder fisierele (text) index.html, pagina1.html, pagina2.html. Pagina index.html va fi pagina de
    prezentare, in principiu cea care se deschide la accesarea site-ului, celelalte doua pagini vor trata doua
    subiecte de interes la alegere (istorie, geografie, arhitectura, plante, animale, calculatoare, literatura,
    cinematografie, sport, stiri, stiinta, hobby-uri, turism)
    In cazul in care lucrati singuri la proiect folderul se va numi NumePrenume
    Veti adauga in acest folder orice alte fisiere (imagini, s.a. ) de care veti avea nevoie.
    Pentru a inlatura orice confuzie, NumePrenume, Nume1Prenume1, Nume2Prenume2 reprezinta nume
    le si prenumele reale, conform carora se va face identificarea si notarea. ( Umorul utilizat in exces in
    acest caz ar putea avea rezultate neprevazute )
    Daca simtiti nevoie sa dati explicatii suplimentare sau sa faceti precizari legate de modul in care ati
    realizat tema adaugati acestea intr-un fisier Readme.txt sau readme.doc in acest folder.
    Predarea proiectului se va face prin trimiterea pe mail a folderului completat si arhivat in format
    .zip sau .rar
    CERINTE:
    Cele trei pagini html vor avea urmatoarele elemente commune in <body>:
    Un antet continand descrierea paginii sau un mesaj de bun venit. (indicatie: se poate folosi tagul de
    sectiune (division) <div> si eventual un id pentru delimitarea acestuia).
    Un meniu de navigare <nav> continand link-urile catre cele trei pagini asezae pe acelasi rand, separate
    prin |.
    O sectiune (<div> cu id de ex main) cu continutul principal al paginii.
    Un footer (<div> cu id de ex f1) cu continut de genul Copyright FSA gr.1331 2015.
    Continutul principal conditii minime pentru fiecare din cele trei pagini:
    a. index.html va trebui sa contina un paragraf cu o scurta descriere a site-ului., un logo sau o
    imagine si cateva link-uri catre site-uri de interes (la alegere)
    b. pagina1.html va trata unul din subiectele la alegere, va avea continutul organizat in cateva
    paragrafe, cu folosirea a cel putin doua tipuri de haedere interne, va contine cel putin o lista si
    doua imagini color.
    c. pagina1.html va trata cel de-al doilea subiect la alegere, organizarea acestuia fiind ca si pentru
    prima pagina, in loc de lista va contine cel putin un tabel.

    2) CSS (10p)
    Creati in folderul mentionat fisierele stil1.css, stil2.css si folositi-le pentru a modifica componentele de
    baza ale celor trei pagini astfel:
    stil1.css - Antetul va primi culoarea de fundal = culoarea 1 din schema 1, meniul de navigare culoarea de
    fundal =culoarea 2 din schema 1, sectiunea principal culoarea 3, iar footerul culoarea 4 Culoarea textului
    si fonturile le veti allege pentru a asigura vizibilitatea si o oarecare estetica a paginii.
    stil2.css la fel ca pentru stil1.css, cu folosirea insa a schemei 2 de culori conform descrierii de mai jos:
    Schemele de culori pe care le veti folosi vor fi urmatoarele:

    Schema 1
    Schema 2
    Schema 3
    Schema 4
    Schema 5
    Schema 6
    Schema 7
    Schema 8
    Schema 9

    Culoare 1
    #DD3784
    #FF8240
    #FFC340
    #6 A4BD07
    #3C9DD0
    #39E639
    #C7F83E
    #FFEC40
    #FFBD70

    Culoare 2
    #7A005C
    #A63A00
    #A67100
    #200772
    #034569
    #008500
    #739D00
    #A69500
    #A66D00

    Culoare 3
    #BC008D
    #FF5900
    #FFAE00
    #3914AF
    #0B6CA2
    #00CC00
    #B1F100
    #FFE500
    #FFA700

    Culoare 4
    #DD64BF
    #FFA743
    #FFD373
    #876ED7
    #64AAD0
    #67E667
    #D4F870
    #FFF573
    #FFCF73

    Modul in care le veti folosi va fi urmatorul:


    -

    Reduceti la o cifra data nasterii fiecaruia prin adunarea repetata a cifrelor ( de ex 21061992  2 +
    1 + 0 + 6 + 1+ 9 + 9 + 2 = 30  3 +0 =3 sau 22121993  29  112). In cazul in care sunteti 2
    pe proiect una dintre schemele obtinute va fi cea corespunzatoare uneia dintre cifre, cealalta celei
    de-a doua cifre daca ele coincid alegeti o alta schema dupa preferinte pe post de schema 2. In
    cazul in care lucrati singur la proiect alegeti o a doua schema diferita de cea corespunzatoare
    cifrei natale cum doriti.

    3) JavaScript (10p)
    Creati in folderul mai sus mentionat fisierul scripturi.js pe care il veti folosi pentru a realiza
    urmatoarele modificari:
    Modificati meniul de navigare comun celor trei pagini organizandu-l ca lista neordonata, dispusa
    orizontal. Modificati scriptul stil1.css pentru ca aceasta lista sa apara in asa fel incat sa dea
    senzatia unui meniu:

    Adaugati un buton in sectiunea de antet si codul necesar astfel incat la apasarea butonului sa se
    modifice culoarea de fundal a sectiunii principale (intr-o culoare la alegere, fixa sau a unei alte
    sectiuni)
    4) Bonusuri (10p)
    Utilizati JavaScript pentru ca atunci cand plasati cursorul mouse-ului pe una dintre imaginile
    prezente in site (una singura, la alegere) sa apara imaginea respectiva in alb-negru, iar la iesirea
    cursorului de pe imagine sa se revina la imaginea initiala color (5p)
    Utilizati JavaScript si un eveniment (la alegere, pe oricare dintre pagini) pentru a rearanja cele 4
    sectiuni din <body> plasand antetul in partea stanga a sectiunii principale, deci facand sa apara 2
    coloane deasupra footer-ului (5p).

    S-ar putea să vă placă și