Scribd Logo
Încărcați

Bine ați venit la Scribd!

  • Limbajul HTML

    Încărcat de

    DavydutzDavid
    10 vizualizări2 pagini
    Limbajul HTML in PDF

    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
    Limbajul HTML in PDF

    Drepturi de autor:

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

    Limbajul HTML

    Încărcat de

    DavydutzDavid
    Limbajul HTML in PDF

    Drepturi de autor:

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

    Limbajul HTML – noțiuni introductive

    1. Structura paginii in HTML 5


    <!DOCTYPE html>
    <html>
    <head>
    <title> Titlu pagină</title>
    </head>
    <body>
    <h1>Titlu</h1>
    <p>Primul meu paragraf</p>
    </body>
    </html>

    2. Taguri – necesita inchidere


    • <head> - conține meta informații despre pagina HTML
    • <title> - specifică un titlu pentru pagina HTML (care este afișat în bara de titlu a browserului sau în fila paginii)
    • <body> - definește corpul documentului, și este un container pentru toate conținuturile vizibile, cum ar fi
    titluri, paragrafe, imagini, hyperlink - uri, tabele, liste, etc.
    • <h1>…<h6> - dimensiune titlu
    • <p> - paragraf
    • <br> - intrerupe randul (nu necesita inchidere)
    • <hr> - linie orizontala (nu necesita inchidere)
    • &nbsp – pune un spatiu de un caracter

    3. Taguri pentru formatare (se introduc local in text – necesita inchidere)


    • <b> - bold (aldin)
    • <i> - italic (cursiv)
    • <u> - underline (subliniat)
    • <sub> - indice
    • <sup> - exponent
    • <q> - ghilimele

    4. Stiluri - adăuga stiluri unui element, cum ar fi culoarea, fontul, dimensiunea și multe altele.
    a) In linie (se introduc in interiorul tagurilor)
    <numetag style="proprietate:valoare;">
    ex. <p style=”background-color: cyan; text-align:center”>text</p>
    b) Local in paragraf
    <span style="proprietate:valoare;">text</span>
    ex. <p>text<span style=”color:red;”>text rosu<span>text</p>

    5. Atribute utilizate frecvent in stiluri:


    • background-color:culoare; – fundal culoare
    • background-image: url(”numeimgine.tip”) – fundal imagine
    • color:culoare; – culoare text (denumire sau RGB – rgb(255, 255, 255) sau hexadecimal - #ff6347)
    • font-family:nume_stil; – stiluri de fonturi (ex. font-family:arial)
    • font-size:valoare px; – marime text (in procente ex. 300% sau pixeli ex. 200 px)
    • text-align:tip_aliniere; – aliniere text pe orizontala (left, center, right, justify)
    • border: 1px solid red; - contur element – grosime, tip linie, culoare (paragraf, imagine)
    • width:valoare px; - latime element (in procente ex. 300% sau pixeli ex. 200 px)
    • height:valoare px; – inaltime element (in procente ex. 300% sau pixeli ex. 200 px)

    6. Linkuri - tagul <a> cu atributul href


    - link catre un alt site
    <a href=”https://www.w3schools.com”>text</a>
    - link catre o pagina din acest site
    <a href="Contact.htm">text</a>
    7. Imagini - tagul <img> cu atributele width si height – in pixeli sau procente) nu necesita inchidere
    <img src="nume_imagine.tip" style="width:100 px; height:100 px;>

    8. Liste <ul> - marcatori (neordonată) sau <ol> - numerotare (ordonată)- necesita inchidere
    <ul>
    <li>text</li>
    <li>text</li>
    </ul>
    Dacă vrem să modificăm tipul de marcatori sau numerotare adăugăm în tagul <ul> un stil sau în tagul <ol> un tip :
    - <ul style="list-style-type:tip_marcator">
    Tip marcatori:
    none - nu afișează marcatorii sau numerotarea
    o circle – cerc gol
    ▪ square – pătrat plin
    - <ol type="valoare">
    Valori: a – litere mici, A – litere mari, I – cifre romane

    9. Tabele <table> - necesita inchidere


    • <tr> - rand
    • <th> - celula pentru antet tabel
    • <td> - celula in rand (creeaza coloana)
    Ex. tabel cu un rând și 3 coloane
    <table>
    <tr>
    <td>text</td>
    <td>text</td>
    <td>text</td>
    </tr>
    </table>

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