marți, 4 octombrie 2016

S4:4.10-7.10

  FISE DE LUCRU:
Parcurgeti secventele din softul educational Pagini web. Notati in caiete notiunile intalnite.

Test din materia aceasta. Notele se trec in catalog.
  • 1 - Elementele principale, cod HTML
  • 2 - Crearea si editarea pagini HTML
  • 3 - Titluri, Paragrafe, Un nou rand, Linie orizontala
  • 4 - Formatul textului

  • HTML – organizarea textului

    1. Elementul de bloc    <p>……</p>
    Creează un paragraf; comunică browserului să insereze o linie liberă în text şi să înceapă o nouă linie. Atributul align specifică alinierea textului şi poate fi: left, right, center, justify. Implicit textul este aliniat la stânga.

    Exerciţiul 1. Scrieţi următorul cod într-un document Notepad şi vizualizaţi în browser.
    <HTML>
    <HEAD>
    <TITLE>Paragrafe</TITLE>
    </HEAD>
    <BODY>
    <P align="center">Paragrafe</P>
    <P> Acesta este un paragraf aliniat la stanga. </P>
    <P align="right"> Acesta este un paragraf aliniat la dreapta. </P> 
    <P align="center"> Acesta este un paragraf aliniat la centru. </P>
    </BODY>
    </HTML>

    1. Elementele heading <h1>……</h1> <h2>……</h2> <h3>……</h3> ….. <h6>……</h6>
    Eticheta <H1> defineşte titlul de dimensiunea maximă, iar <H6> pe cel de dimensiune minimă. Etichetele de titlu acceptă atributul align cu valorile left, center şi right pentru alinierea titlului blocului de text la stânga (în mod prestabilit), în centru şi respectiv la dreapta.

    Exerciţiul 2. Scrieţi următorul cod într-un document Notepad şi vizualizaţi în browser.
    <HTML>
    <HEAD>
    <TITLE>Titluri de diferite mărimi</TITLE>
    </HEAD>
    <BODY>
    <H1 align="center">Titlu H1</H1>
     <H2>Titlu H2</H2>
    <H3>Titlu H3</H3>
    <H4 align="center">Titlu H4</H4>
    <H5>Titlu H5</H5>
    <H6>Titlu H6</H6>
    </BODY>
    </HTML>

    1. Linii orizontale <hr>
    Pot fi inserate în pagină linii orizontale care au rolul de a delimita diferitele zone ale paginii sau de a îmbunătăţi aspectul ei estetic. Pentru a configura o linie orizontală se utilizează următoarele atribute ale etichetei <HR>:
     align - permite alinierea liniei orizontale. Valorile posibile sunt left, center şi right
     width - specifică lungimea liniei - lungimea poate fi stabilită în pixeli sau în procente din lăţimea ecranului.
     size - specifică grosimea liniei, exprimată în pixeli
     color - permite definirea culorii liniei

    Exerciţiul 3. Scrieţi următorul cod într-un document Notepad şi vizualizaţi în browser.
    <HTML>
    <HEAD>
    <TITLE>Linii orizontale</TITLE>
    </HEAD>
    <BODY>
    <H1 align="center"> Linii orizontale </H1>
    Linie aliniata la stanga, lungime 100%, grosime 2 <HR>
    Linie aliniata in centru , lungime 50%, grosime 5 pixeli.
    <HR align="center" width="50%" size="5" color="black">
    Linie aliniata la dreapta , lungime 150 de pixeli, grosime 12 pixeli , de culoare rosie.
    <HR align="right" width=150 size=12 color="red">
    </BODY>
    </HTML>

    4.       Inserarea unei adrese poştale <address> …….</address>.

    Eticheta <ADDRESS> este o etichetă logică şi are drept efect, în cele mai multe browsere, afişarea textului cu caractere italice.

    Exerciţiul 4. Scrieţi următorul cod într-un document Notepad şi vizualizaţi în browser.
    <HTML>
    <HEAD>
    <TITLE>Inserarea unei adresa</TITLE>
    </HEAD>
    <BODY>
    <H1 align="center"> Adresa </H1>
    <HR>
    Adresa firmei noastre este
    <ADDRESS>
    GoldenWeb Consult <BR>
    Str. Paradisului, Nr. 1<BR>
    Bucuresti
    </ADDRESS>
    </BODY>
    </HTML>

    Exerciţiul 5.
    1. Creaţi o pagină Web în care să introduceţi următorul text:
    Plumb
    ______________________________

    Dormeau adânc sicriele de plumb,
    Şi flori de plumb şi funerar vestmânt --
    Stam singur în cavou... si era vânt...
    Şi scârţiiau coroanele de plumb.

    Dormea întors amorul meu de plumb
    Pe flori de plumb, şi-am început să-l strig -
    Stam singur lângă mort... si era frig...
    Şi-i atârnau aripile de plumb.

    2. Efectuaţi următoarele modificări:
    a)       fontul textului să fie Arial
    b)       adăugaţi documentului titlul „George Bacovia
    c)       aplicaţi stilul „îngroşat” pentru fiecare cuvânt plumb şi stilul înclinat pentru cuvântul flori
    d)       setaţi grosimea liniei la 12 pixeli şi culoarea roşie
    e)       formataţi titlul poeziei astfel încât să reprezinte un titlu de nivel 3 (H3)
    f)        aliniaţi centrat paragraful care conţine titlul poeziei
   

Niciun comentariu:

Trimiteți un comentariu