Scribd Logo
Upload

Welcome to Scribd!

  • Prezentacija Za HTML

    Uploaded by

    Tatjana Božić
    563 views13 pages
    Poceci rada u HTML

    Original Title

    Prezentacija za HTML

    Copyright

    © © All Rights Reserved

    Available Formats

    PPTX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    Poceci rada u HTML

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    563 views13 pages

    Prezentacija Za HTML

    Uploaded by

    Tatjana Božić
    Poceci rada u HTML

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 13

    HTML

    Hypertext Markup Language


    • Jezik brauzera kao što su Edge, Chrome, Mozila
    • Nije programski jezik
    • World Wide Web Consortium je kreirao standarde
    HTML-a
    • CSS se koristi da dodeli stil HTML stranici
    Tag elementi u HTML-u
    • <p></p> Paragraf
    • <h1></h1> Naslov
    • <i></i> italik
    • <b></b> bold
    Tekst je okružen tagom za otvaranje i tagom za
    zatvaranje:
    <h1>Ovo je naslov</h1>
    <p>Ovo je jedan pasus</p>
    1. zadatak
    Ovo nije tag html-a, to je
    <!DOCTYPE html> napomena brauzeru da je
    u pitanju HTML5. Obaveza.
    <html>
    <head>
    <title>Muzicar ucenik</title>
    </head>
    <body>
    Svaki tag ima deo
    <p>Zdravo svete</p> koji ga otvara i deo
    koji ga zatvara.
    </body>
    </html>
    Čuvanje HTML datoteke

    • Odabrati All files u Notepadu


    • Uneti naslov vežbe i dodati .html
    • Kao kodnu tabelu odabrati UTF-8.
    • Dokument će dobiti ikonu koja je identična
    brauzeru koji je definisan kao „difolt brauzer“
    u našem operativnom sistemu.
    BLOK ili LINIJSKI NIVO elementi
    • Kreiraju veliku količinu sadržaja
    • Blok elementi zauzimaju čitavu moguću širinu
    monitora koji posedujete.
    • Sa svakim novim blok elementom ide nova linija.
    Npr.
    <p> paragraf
    <h1> - <h6> Naslovi
    <form> Forme
    <div> div tagovi
    Elementi u liniji
    – NE kreiraju novu liniju
    • Mogu biti pozicionirani pored drugih
    elemenata, ne stvaraju novu liniju
    • Ne možemo definisati njihovu širinu
    • Npr.:
    • <a> linkovi
    • <strong> i <b> bold
    • <input/> tag (biće objašnjen kasnije)
    • <span> tag za deljenje oblasti
    ATRIBUTI tagova
    • Većina atributa sadrži Ime=„Vrednost“ par
    • Atributi omogućuju dodatne informacije o
    elementu
    • Atributi su uvek specificirani u start tagu.
    Npr. u:
    <a href=„https://google.com“>Google</a>
    href je IME atributa, a „https://google.com“ je
    njegova vrednost u <a> tagu.
    Ostali uobičajeni ATRIBUTI
    • style – stajling koji možemo odraditi u css
    <p style=„color:red“>Ovaj paragraf će biti crvene
    boje</p>
    • Id & class – specifikacija elementa u css
    • title – dodatno objašnjenje o elementu, kao
    savet u nekom brauzeru
    • <a href=„https://google.com“ title=„Klikni da
    odeš na sajt Googl“>Google</a>
    SINGLETON tagovi
    To su tagovi koji nemaju deo koji zatvara tag </ >.
    Takođe se zovu void tagovi.
    Primer su:
    <br> za prekid linije teksta
    <hr> horizontalna linija
    <img> slika ilustracija
    <command>
    Dodavanje ILUSTRACIJA
    Korišćenje slika u HTML dokumentu vrši se preko
    taga <img>:
    <img src=„klimt.jpg“ alt=„Poljubac“ />

    src je source tj. Naziv slike, a alt sadrži tekst koji


    će se pojaviti u sajtu ukoliko brauzer ne učita
    sliku.
    ODVAJANJE i STIL u HTML dokumentu
    Dokument možemo urediti sa atributom „style“ ili
    korišćenjem css-a. Style je inlajn element.
    <div> ili <span>:

    <div style=„padding:5px;background-color:black;colour:white;“>
    <h1>Naš naslov</h1>
    <p>Ovo je naš paragraf</p>
    </div>
    Ova dva paragrafa će se nalaziti u crnom
    pravougaoniku i biće ispisano belim tekstom sve
    između div tagova za otvaranje i zatvaranje.
    Selektori Style atributa
    • Sintaksa izgleda ovako:
    <p style=„selector:value;“>Neki tekst</p>
    • Uobičajeni Selektori i vrednosti
    color:red; background-color:blue;
    background-image:some-image.jpg;
    padding:5px; margin:5px;
    border-style:solid; border-color:black; border-with:1px;
    SKRAĆENO ako ima više vrednosti: border:solid black 1px;

    You might also like