Creare si editare pagini HTML pas cu pas

1. Crearea bazei de început a unui document

Dupa cum ati vazut in postarile anterioare, sunt elemente sigure, generale, care sunt necesare pentru crearea unui document HTML.

Pentru început deschideti aplicatia NotePad++ si scrieti structura de baza a unei pagini web. 

 Aceasta este:
<html>
  <head>
    <title> Titlul </title>
  </head>
  <body>
    Continut
  </body>
</html>
Acum pagina dv. are HEAD si BODY in interiorul bazei <HTML>.

2.Setarea proprietarilor documentului

Proprietatile documentului pot fi controlate de atributele elementului BODY, de exemplu cum ar fi culorile pentru fondul paginii, pentru text si diferite faze ale link-urilor.
Culorile sunt setate folosind culorile de baza: rosu, verde si albastru; expresia folosita RGB (Red, Green, Blue), acestea sunt reprezentate ca valori hexadecimale si sunt scrise intre ghilimele (" "), la inceput trebuie adaugat caracterul '#'. Fiecare 2 unitati ale codului reprezinta una din culorile RGB.
De exemplu: #00aa11  reprezinta o culoare care nu are Rosu (00), are Verde (aa) si Albastru mai putin (11).

Elementul BODY
  • - Acestui element ii puteti adauga informatii care sa defineasca culoarea sau imaginea din fondul paginii, textul si culoarea link-urilor.
  • - Daca elementul BODY nu este completat cu alte atribute atunci browser-ul va prezenta culorile standard, de obicei fondul este alb.
  • - Pentru a seta culoare fondului paginii adaugati in eticheta <BODY> atributul BGCOLOR.
  • - Urmatorul exemplu va prezenta un document a carui fond este de culoare albastra:
    <body bgcolor="#0000ff"></body>
  • Culoarea textului
    • - Atributul TEXT  controleaza culoarea textului normal din document.
    • - Acesta va afecta tot textul din document care nu este colorat de alte elemente, cum ar fi link-ul.
    • - Culoarea standard pentru text este Negru.
    • - Iata un exemplu in care culoarea fondului va fi albastru si culoarea textului va fi rosu, atributul TEXT va fi adaugat astfel:
      <body bgcolor="#0000ff" text="#ff0000"></body>
  • Link-uri (LINK, VLINK si ALINK)
    • - Aceste atribute controleaza culoarea link-ului in diferite stari
        1. LINK - culoarea initiala a link-ului. Standard este albastru
        2. VLINK - culoarea unui link vizitat. Standard este purpuriu.
        3. ALINK - culoarea link-ului in momentul activarii. Standard este rosu.
    • - Modul de setare al acestor atribute este urmatorul:
      <body bgcolor="#ffffff" text="#ff0000" link="#0000ff" vlink="#ff00ff" alink="#ffff00"></body>
      Rezultatul va fi o pagina cu fondul alb, textul rosu, link-urile albastre, link-urile vizitate vor avea culoarea roz iar culoarea link-urilor in momentul activarii va fi galben.
  • Folosirea unei imagini ca fond pentru pagina (background)
    • - Elementul body ofera posibilitatea înlocuiri fondului paginii cu o imagine (Background image). Daca imaginea este mai mica decât dimensiunile paginii atunci imaginea va fi multiplicata pana va acoperi întreg cadru documentului. Este indicat ca imaginea sa fie in format *.gif sau *.jpg. Folosirea unei imagini va da un aspect placut documentului. Pentru a vedea cum arata un document al carui fond este o imagine click aici.
    • - Un exemplu de cod HTML cu imagine pentru background este urmatorul:
      <body background="imagine.gif" bgcolor="#ffffff"></body>
      In acest exemplu fondul pagini va fi dat de imaginea fisierului "imagine.gif" si de asemenea am setat BGCOLOR astfel incat in timpul procesului de încarcare a imaginii culoarea fondului va fi alba.



Comentarii

Trimiteți un comentariu

Postări populare de pe acest blog

Marcatori si numerotare

Imagine
HTML contine cateva tag-uri utile pentru asezarea continutului in pagina. Prin acestea textul este mai usor de citit si evidentiat. 1. Elementele pentru marcatori si numerotare Un element des folosit in formarea listelor (neordonate) este  <ul> . -  <ul>  este elementul de început si dupa scrierea listei se incheie cu  </ul> . - Majoritatea elementelor pentru marcatori si numerotare sunt compuse din unu sau mai multe elemente  <li> ... </li>  (list element). Fara atributul "type" specificat in "<ul>" acestea prezintă un marcaj ca un bullet. Mai jos puteti vedea exemplu. <html> <head> <title>titlu documentului</title> </head> <body> <ul> <li>List item 1 ...</li> <li>List item 2 ...</li> <li>List item 3 ...</li> </ul> </body> </html> - In pagina web apare asa: List item 1 ... List item 2 ... List ite...
Citiți mai multe

Introducere in HTML

Imagine
HTML (HyperText Markup Language) este un limbaj utilizat pentru crearea paginilor web ce pot fi afisate intr-un browser (sau navigator).  HTML este folosit pentru prezentarea unui continut (text, imagine) intr-o pagina web, furnizeaza mijloacele prin care continutul unui document poate fi structurat si adnotat cu diverse tipuri de metadate si indicatii de redare si afisare. A ceste indicatiile pot varia de la decoratiuni minore ale textului, cum ar fi culoarea sau sublinierea unui cuvant ori introducerea unei imagini, pana la adaugarea de elemente sofisticate, tabele, harti de imagini, formulare si cod CSS sau scripturi JavaScript. HTML este un format text proiectat pentru a putea fi citit si editat utilizand un editor de text simplu, editarea si intelegerea paginilor in acest fel necesita cunostinte de HTML, pe care le puteti obtine studiind lectiile din acest curs. Acest blog prezinta elementele de baza ale limbajului HTML si modul de lucru cu acesta, va ajuta sa inv...
Citiți mai multe