Semnificația etichetelor în html. Etichete HTML de bază

Editor: Mandrik R.A.

document HTML (pagina)- un document scris în limbaj de marcare hipertext (HTML). Cuprins între steaguri Și.

Site web, server web- un lanț de documente legate logic scrise în HTML.

Valorile marcajului documentului

Steaguri de marcare— comenzi speciale pentru aranjarea fragmentelor de text, grafică, video și audio pe ecran, precum și comenzi utilizate pentru a comunica cu alte documente HTML și resurse de Internet.

Semnale de markup de bază

Și. Între aceste steaguri se află informații despre document.

Și. Aceste steaguri conțin numele paginii, care va fi afișat în cadrul ferestrei de vizualizare.

Și. „Corpul” documentului (text, grafică etc.) se află între aceste două steaguri.

Opțiuni de semnalizare :

BGCOLOR - culoarea de fundal ( )

FUNDAL - „tapet” sau fundal

TEXT - culoarea textului

ALINK - culoarea legăturii active Semnele utilizate pentru formatarea textului

Steaguri folosite pentru a evidenția paragrafele. Un nou paragraf este întotdeauna separat de cel anterior printr-o linie goală.

Un steag folosit pentru a încheia textul pe o altă linie. Poate fi folosit și pentru a separa elementele grafice de text prin spațiere.


Un steag folosit pentru a separa logic textul cu o linie orizontală.

ȘI
Între aceste steaguri este text preformatat. Este afișat pe ecran într-un font ca „curier”.

Opțiuni de aliniere

Folosit in

ALIGN=LEFT — aliniere la stânga

ALIGN=RIGHT — aliniere la marginea din dreapta

ALIGN=CENTER — alinierea la centru

Steaguri de aliniere

Și- alinierea la stânga

Și- alinierea la dreapta

Și
- alinierea la centru

Titluri folosite pentru a evidenția părți logice ale textului

Și

Titlu de primul nivel.

Și

Titlu de al doilea nivel.

Și

Titlu de nivel al treilea.

Și

Al patrulea nivel al titlului.

Și
Titlu de nivel 5.

Și
Titlu de nivel șase.

Steaguri pentru evidențierea textului și a fontului

Și Steaguri pentru evidențierea textului (cuvinte, litere) cu caractere aldine.

Și Steaguri pentru evidențierea textului (cuvinte, litere) cu font italic, tip italic.

Și Textul situat între aceste două steaguri va fi subliniat.

Și Textul situat între aceste două steaguri va clipi.

Și

Și Steaguri pentru schimbarea dimensiunii fontului.

Și Steaguri pentru schimbarea culorii fontului.

Steaguri pentru generarea listelor

Steaguri care indică începutul și sfârșitul unei liste numerotate

Steaguri care indică începutul și sfârșitul unei liste cu marcatori.

  • Element din listă

    Și
    Steaguri care indică începutul și sfârșitul glosarului.

    Termenul glosarului este situat fără indentare din marginea din stânga a paginii.

    Descrierea termenului este indentată din marginea din stânga a paginii.

    Indicatori-comenzi pentru inserarea obiectelor informaționale non-text în text

    sau — comandă pentru inserarea unei imagini grafice

    — comandă pentru a introduce un fragment de sunet

    — comandă pentru a insera un fragment video

    Opțiuni grafice

    WIDHT - lățimea imaginii în pixeli

    HEIGHT - înălțimea imaginii în pixeli

    ALIGN - aliniere (ALIGN=LEFT - aliniere la marginea stângă, ALIGN=RIGHT - la marginea dreaptă, ALIGN=TOP - la marginea de sus, ALIGN=BOTTOM - la marginea de jos, ALIGN=MIDDLE sau CENTER - la centru )

    HSPACE - spațiu orizontal din imaginea grafică

    VSPACE - spațiu vertical

    ALT - text alternativ, folosit pentru a indica o imagine

    Comenzi pentru hyperlink cu alte documente HTML și resurse de Internet

    Și sau Și- hyperlinkuri

    [email protected]
    - hyperlink cu adresa de e-mail

    Tabel - o grilă pentru afișarea datelor în rânduri și coloane, precum și un format de text

    Și
    Indicatori pentru inserarea unui tabel într-un document HTML

    Opțiuni de semnalizare

    BGCOLOR - culoarea de fundal

    BORDER - lățimea chenarului

    WIDHT - lățimea mesei

    Steaguri pentru aspectul tabelului

    — numele tabelului, are parametrul ALIGN=TOP — aliniere deasupra tabelului și ALIGN=BOTTOM — sub tabel.

    Și Rând de masă. Poate avea parametrii BGCOLOR - culoarea de fundal în interiorul liniei; ALIGN=LEFT, RIGHT, CENTER — aliniere în cadrul unei linii; VALIGN=SUS, JOS, MIJLOC - aliniere verticală într-un rând de tabel.

    Coloana tabelului. Poate avea parametrii BGCOLOR - culoarea de fundal sub coloană; ALIGN=LEFT, RIGHT, CENTER — aliniere în cadrul coloanei; VALIGN=SUS, JOS, MIJLOC - aliniere verticală; COLSPAN întinde o celulă pe mai multe coloane, ROWSPAN întinde o celulă pe mai multe linii.

    Titlul coloanei. Poate avea parametrii BGCOLOR - culoare de fundal sub nume; ALIGN=STÂNGA, DREAPTA, CENTRU - aliniere; VALIGN=SUS, JOS, MIJLOC - aliniere verticală; COLSPAN, ROWSPAN - întinderea unei celule în mai multe coloane sau rânduri; WIDHT - lățimea titlului.

    Rame de cadru

    Cadrele sunt un mijloc de împărțire a ecranului în mai multe zone, fiecare dintre acestea afișând conținutul unei pagini Web separate sau chiar al unui întreg site Web.

    Și Steaguri pentru crearea unui cadru

    Opțiuni de semnalizare

    COLS - împărțiți ecranul într-un anumit număr de coloane (verticală)

    RÂNDURI - împărțiți ecranul într-un anumit număr de coloane (orizontale)

    BORCOLOR - culoarea cadrului

    BORDER - lățimea chenarului

    FRAMEBORDER - chenar cadru (FRAMEBORDER=YES - există o chenar, FRAMEBORDER=NU - nu există chenar,

    FRAMESPACING=n — lățimea chenarului)

    Steagul pentru a descrie cadrul ( ).

    Opțiuni de semnalizare

    SCROLING - parametru pentru reglarea barei de defilare:

    SCROLING=DA - bara de defilare va fi mereu acolo

    SCROLING=NU - nu va exista nicio bară de defilare

    SCROLING=AUTO - bara de defilare apare doar atunci când este necesar

    MARGINWIDHT și MARGINHEIGHT - parametri care controlează indentarea din interiorul cadrelor, utilizați pentru a alinia imaginea grafică în interiorul cadrului

    NORESIZE este un parametru care indică faptul că dimensiunea cadrului cadrului nu se va schimba niciodată.

    Un link către fişier.htm— Comunicarea între cadre

    TARGET - atribut de comunicare între cadre. Are mai multe semnificații:

    BLANK încarcă conținutul paginii specificate de link într-o nouă fereastră goală.

    PARENT încarcă conținutul paginii specificate de link în fereastra care este proprietarul imediat al setului de cadre.

    Gestionarea browserelor care nu acceptă cadre:

    ...Cadrele se află aici

    ...Textul fără cadre merge aici

    În secțiunea destinată acelor utilizatori care „nu văd” cadrul, puteți plasa niște text explicativ.

    Ticker

    TEXT— Steagul care creează un ticker

    TEKCT— Dacă tickerul trebuie direcționat de la dreapta la stânga

    TEKCT- miscare de la stanga la dreapta.

    defilare - mișcare standard de la dreapta la stânga

    slide - inscripția rulează o dată de la marginea dreaptă la stânga, unde rămâne.

    alternativ - mișcare de la marginea dreaptă a paginii la stânga și înapoi. Ciclu fără sfârșit.

    TEKCT— Limitarea numărului de cicluri. Valoarea n a instrucțiunii LOOP specifică de câte ori bucla va fi repetată.

    TEKCT— indicați lățimea zonei ocupate de linia de târâtoare, unde n este lățimea părții din pagină pe care se află linia de târâtoare. Valoarea n este specificată atât în ​​pixeli, cât și ca procent din lățimea totală vizibilă a paginii.

    TEKCT— Reglarea mișcării inscripției pe ecran. Aici n este numărul de pixeli.

    TEKCTÎn acest caz, variabila — timpul t — este măsurată în milisecunde. Metoda de setare a vitezei constă în specificarea timpului după care textul va fi redesenat din nou pe ecran.

    TEXT— capacitatea de a specifica dimensiunea fontului textului într-o linie.

    TEXT— colorează suprafața liniei de rulare în orice culoare, unde n, așa cum sa întâmplat înainte, poate fi specificat ca număr hexazecimal sau prin scrierea numelui acestuia

    TEXT— specificați înălțimea liniei de glisare, specificând valoarea n în pixeli

    Când începeți să scrieți un document HTML, este logic să îl identificați ca atare. Această identificare se realizează prin introducerea etichetelor chiar la începutul documentuluiȘi (respectiv, la sfârșitul documentului, eticheta de închidere; nu uita niciodată să închizi parantezele!). Eticheta doctype este o etichetă de limbaj sgml și declară că documentul va fi descris conform specificației html 3.2. Eticheta html indică începutul documentului. Acum este timpul să ne gândim la conținut. Să începem, firește, cu titlul. Antetul fișierului html se află în secțiunea necesară , care ar trebui să fie chiar la început, adică imediat după etichetă . Titlul este formatat folosind o etichetă . Să numim documentul nostru „prima pagină de pornire”. Mai jos este o listă a documentului html rezultat:</p> <p><title>prima pagină de pornire

    Să încercăm să vedem acest fișier folosind un program de vizualizare, de exemplu, navigatorul de la netscape communications corp. După descărcare, ecranul programului a rămas gol. „Unde este titlul?” se va întreba cititorul indignat. Aruncă o privire mai atentă la TITLUL FERESTEI al vizualizatorului din sistemul de ferestre și asigură-te că titlul este afișat acolo. Etichetă vă permite să setați un titlu pentru întregul document. Acest nume va apărea în titlul ferestrei de vizualizare și va apărea și în lista de marcaje (marcaje, comenzi rapide în diverse terminologii) la crearea acestora.</p> <p>Alte elemente de secțiune <head>…</head> sunt:</p> <p><base параметры>— etichetă pentru specificarea adresei URL a documentului. Eticheta are următorii parametri:</p> <p>href - specifică adresa URL de bază pentru document. Notă: adresa URL trebuie specificată în formă completă.</p> <p>țintă - specifică o fereastră pentru afișarea documentelor la care se face referire în acest document.</p> <p><style>— o etichetă rezervată pentru utilizare ulterioară pentru așa-numitele „stiluri” (stylesheets). Sintaxa exactă a etichetei nu este încă documentată.</p> <p><meta параметры>- o etichetă care teoretic ar trebui folosită pentru a include într-un document unele informații specifice pentru indexarea programelor, catalogatorilor etc. În plus, are câțiva parametri utili care permit paginilor să se înlocuiască între ele după anumite perioade de timp. Eticheta are următorii parametri:</p> <p>http-equiv="refresh" - îi spune spectatorului să sară la pagina specificată în parametrul de conținut după perioada de timp specificată acolo.</p> <p>continut=“numar; url=url" — setează numărul intervalului de timp și adresa URL pentru comanda http-equiv="refresh".</p> <p>name="description" sau name="keywords" - spune serverului cum să interpreteze parametrul de conținut - ca o descriere a documentului sau ca o listă de cuvinte cheie.</p> <p>content="text sau listă de valori" nu este o greșeală de tipar. Parametrul de conținut are două semnificații: unul pentru comanda http-equiv="refresh", celălalt pentru comanda name. În acest din urmă caz, valoarea parametrului specifică fie o descriere a documentului (dacă parametrul name="description"), fie o listă de cuvinte cheie separate prin virgulă (dacă parametrul name="keywords").</p> <p>Acum să trecem la formatarea conținutului documentului. În termeni html, conținutul unui document se numește BODY, sau în engleză - body. Exact așa se numește o etichetă, al cărei câmp de acțiune conține tot conținutul (adică este închis între interiorul etichetei <body>…<script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> </body>). Etichetă <body>…<script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> </body> poate conține opțiuni suplimentare care vă permit să schimbați culorile utilizate în document sau să atribuiți o imagine de fundal:</p> <p>bgcolor - definește culoarea de fundal a documentului. Culoarea poate fi specificată ca un triplet rgb (de exemplu, bgcolor="#ffffff"-culoare albă) sau poate fi unul dintre numele simbolice predefinite:</p> <p>aqua negru albastru fuch</p> <p>gri verde lome maro</p> <p>bleumarin oliv roșu violet</p> <p>argintiu teal alb galben</p> <p>fundal - vă permite să setați o imagine de fundal pentru document. Imaginea va fi înmulțită (tiglată) și va acoperi întreaga zonă vizibilă a zonei de afișare a ferestrei de vizualizare.</p> <p>text — setează culoarea textului documentului. Culoarea este setată în același mod ca și pentru parametrul bgcolor.</p> <p>link - setează culoarea pentru text și cadre de imagine în zonele active ale documentului care conține link-uri (ancore).</p> <p>vlink - (culoarea linkurilor vizitate) setează culoarea linkurilor selectate anterior.</p> <p>alink — (culoarea legăturilor active) setează culoarea legăturilor în momentul selecției.</p> <p>Alte mijloace de proiectare a fontului textului sunt cursive și aldine. În acest fel, este foarte convenabil să evidențiezi cuvinte individuale în text, precum și să creezi titluri. De exemplu, este foarte convenabil să proiectați anteturi ale primului și al doilea nivel folosind etichete <hn>, iar titlurile de al treilea nivel sunt evidențiate cu caractere aldine. Italicizarea se face folosind eticheta <i>(din cuvântul italic), iar în aldine - folosind eticheta <b>(din cuvântul bold).</p> <p>În html există și conceptul de accent – ​​evidențiere generalizată. Este formatat folosind o etichetă <em>…</em>. Această evidențiere este un mijloc de a descrie structura logică a unui document. De obicei, textul evidențiat în acest fel este afișat cu caractere cursive.</p> <p>Un alt mijloc de evidențiere logică poate fi considerat eticheta</p> <p><strong>…</strong></p> <p>Este folosit pentru a îmbunătăți secțiuni de text. Conținutul etichetei este de obicei afișat cu caractere aldine.</p> <p>Puteți modifica dimensiunea și culoarea fonturilor folosind eticheta</p> <p><font параметры>…</font></p> <p>Parametrii pot fi după cum urmează:</p> <p>size="valoare sau valoare" - setează dimensiunea absolută sau relativă a fontului. Mărimea relativă este stabilită în raport cu dimensiunea de bază (vezi mai jos). Gama de valori acceptate este de la unu la șapte.</p> <p>culoare - specifică culoarea textului.</p> <p>face este o extensie pentru Microsoft Internet Explorer și Netscape Navigator. Vă permite să specificați un font (sau o listă de fonturi; cel mai potrivit va fi selectat dintre fonturile disponibile în sistem) pentru text. Rezultatul final depinde de numărul și varietatea fonturilor instalate pe sistem. Exemplu:</p> <p><font face=»arial, times roman»></p> <p>Un exemplu de evidențiere a textului cu un tip de caractere diferit.</p> <p>Dimensiunea fontului de bază pentru întregul document poate fi setată folosind eticheta</p> <p><basefont параметры>. Există un singur parametru:</p> <p>dimensiune — setează dimensiunea fontului.</p> <p>Pentru a atrage cu adevărat utilizatorul, uneori poate fi necesar text intermitent. Puteți face textul să clipească prin includerea lui într-o etichetă</p> <p><blink>…</blink></p> <p>Această etichetă trebuie utilizată cu oarecare precauție, deoarece nu este întotdeauna plăcut să observați obiectele care clipesc.</p> <p>Una dintre cele mai puternice caracteristici ale www este capacitatea de a organiza legături hipertext între documente. Înainte de a descrie mijloacele limbajului HTML pentru organizarea unor astfel de conexiuni, ar trebui să vorbim despre identificarea resurselor de pe Internet. Cantitatea de informații de pe Internet este enormă și există multe modalități de a le accesa. Pentru a indica locația unei singure resurse, este folosită o intrare numită url (localizare uniformă a resurselor). Descrie modul în care este accesată o resursă și locația acesteia. URL-ul arată astfel:</p> <p>method://[nume utilizator@][gazdă][:port][nume resursă], unde</p> <p>metoda identifică metoda de accesare a resursei,</p> <p>username indică numele de conectare al utilizatorului în sistem, presupunând de obicei acces anonim.</p> <p>gazdă specifică numele rețelei (sau adresa de rețea) a gazdei care conține resursa.</p> <p>port: numărul portului pentru a accesa serviciul.</p> <p>resource-name identifică o resursă pe gazdă și depinde de metoda de acces.</p> <p>Există identificatori pentru metodele de accesare a resurselor pentru majoritatea serviciilor de internet. Denumirile sunt următoarele:</p> <p>http - pentru acces prin protocolul http utilizat în www.</p> <p>ftp - pentru acces prin protocolul ftp.</p> <p>telnet - pentru acces prin protocolul telnet, emulare terminal.</p> <p>gopher - pentru accesarea serverelor gopher.</p> <p>wais - pentru a accesa wais (sistem de informații cu arie largă).</p> <p>știri - pentru a accesa știrile usenet.</p> <p>fișier - pentru a accesa fișierele locale.</p> <p>Pentru a proiecta orice element de document ca link hipertext, trebuie doar să-l încadrați într-o etichetă <a>(ancoră). Sintaxa completă a etichetei este:</p> <p><a параметры></p> <p>unde parametrii pot fi după cum urmează:</p> <p>href este un parametru obligatoriu, specifică fie adresa URL, fie fișierul la care ne conectăm. Dacă ne referim la un fișier, atunci câmpul href conține numele fișierului în sistemul de fișiere al serverului web.</p> <p>target - parametru care indică numele ferestrei sau cadrului în care va fi afișat documentul. Dacă nu există o fereastră sau un cadru cu același nume, se va deschide o nouă fereastră.</p> <p>Organizarea textului într-un document</p> <p>HTML vă permite să definiți aspectul unor paragrafe întregi de text. Puteți organiza paragrafele în liste, le puteți afișa formatate pe ecran sau puteți mări marginea din stânga. Să privim totul în ordine.</p> <p>Liste neordonate:</p> <p>Textul situat între etichete este perceput ca o listă nenumerată. Fiecare nou articol din listă ar trebui să înceapă cu o etichetă <LI>. De exemplu, pentru a crea o listă ca aceasta:</p> <p>* iapă albă</p> <p>Aveți nevoie de următorul text HTML:</p> <p><LI>Ivan;</p> <p><LI>Danila;</p> <p><LI>iapa albă</p> <p>Vă rugăm să rețineți: la marcaj <LI>nu există niciun semn de închidere pereche.</p> <p>Liste numerotate:</p> <p>Listele numerotate sunt construite exact la fel ca listele nenumerotate, doar numerele sunt folosite în loc de caractere pentru a indica un nou element. Pentru a modifica ușor exemplul nostru anterior:</p> <p><LI>Ivan;</p> <p><LI>Danila;</p> <p><LI>iapa albă</p> <p>Aceasta este lista pe care o primești:</p> <p>— 1. Ivan;</p> <p>— 2. Danila;</p> <p>— 3. iapă albă</p> <p>Liste de definiții: <DL> … </DL></p> <p>O listă de definiții este oarecum diferită de alte tipuri de liste. În loc de etichete <LI>listele de definiții folosesc etichete <DT>(din engleză termen de definiție - termen definit) și <DD>(din engleză definiție definiție - definiție definiție). Să ne uităm la asta cu un exemplu. Să presupunem că avem următoarea bucată de text HTML:</p> <p><DD>Termenul HTML (HyperText Markup Language) înseamnă</p> <p>„Limbajul de marcare hipertext”. Prima versiune de HTML</p> <p>dezvoltat de un angajat al Laboratorului European de Fizică</p> <p>particule elementare Tim Berners-Lee.</p> <p><DT>document HTML</p> <p><DD>Fișier text cu extensia *.html</p> <p>(Sistemele Unix pot conține fișiere</p> <p>cu extensia *.htmll).</p> <p>Acest fragment va fi afișat pe ecran după cum urmează:</p> <p>Termenul HTML (HyperText Markup Language) înseamnă „limbaj de marcare hipertext”. Prima versiune de HTML a fost dezvoltată de Tim Berners-Lee, un bursier la Laboratorul European de Fizică a Particulei.</p> <p>document HTML</p> <p>Fișier text cu extensia *.html (sistemele Unix pot conține fișiere cu extensia *.htmll).</p> <p>Vă rugăm să rețineți: exact la fel ca și mărcile <LI>, Etichete <DT>Și <DD>nu au semne de închidere asociate.</p> <p>Dacă termenii definiți sunt suficient de scurti, se poate folosi o etichetă de deschidere modificată <DL COMPACT>. De exemplu, iată un fragment de text HTML:</p> <p><DL COMPACT></p> <p><DD>Prima literă a alfabetului</p> <p><DD>A doua literă a alfabetului</p> <p><DD>A treia literă a alfabetului</p> <p>va fi afișat ceva de genul:</p> <p>Prima literă a alfabetului</p> <p>A doua literă a alfabetului</p> <p>A treia literă a alfabetului</p> <p>Liste imbricate</p> <p>Un element al oricărei liste poate conține o listă întreagă de orice fel. Numărul de niveluri de imbricare este în principiu nelimitat, dar listele imbricate nu trebuie abuzate.</p> <p>Listele imbricate sunt foarte convenabile atunci când pregătiți diferite tipuri de planuri și cuprins.</p> <p><title>Exemplul 6

    HTML acceptă mai multe tipuri de liste

    Liste neordonate

    Elementele unei liste neordonate sunt evidențiate cu un caracter special și indentare din stânga:

  • Elementul 1

  • Elementul 2

  • Elementul 3

    Liste numerotate

    Elementele unei liste numerotate sunt indentate în stânga, precum și numerotate:

  • Elementul 1

  • Elementul 2

  • Elementul 3

    Liste de definiții

    Acest tip de listă este puțin mai complicat decât precedentele două, dar arată și mai impresionant.

    Amintiți-vă că listele pot fi imbricate una în alta, dar nu ar trebui să construiți prea multe niveluri de imbricare.

    Rețineți că pot exista mai multe paragrafe într-un articol din listă. Toate paragrafele vor avea aceeași marjă din stânga.

    Text bogat:

    La început, am vorbit despre modul în care browserele ignoră spațiile multiple și caracterele de la sfârșitul rândului. Există, totuși, o excepție de la această regulă.

    Text între etichete

    ȘI
    (din engleză preformatted - pre-formatted), este afișat de browser pe ecran așa cum este - cu toate spațiile, file și caractere de sfârșit de rând. Acest lucru este foarte convenabil atunci când creați tabele simple.

    Text indentat:

    Textul cuprins între etichete este afișat de browser pe ecran cu o margine din stânga mărită.

    Dispunerea tabelului

    Tabelele sunt cel mai puternic instrument HTML pentru aspectul paginii. Înainte de apariția instrumentelor de aranjare a tabelelor în limbajul HTML, era imposibil să se creeze chiar și cel mai simplu text cu mai multe coloane sau tabel pivot, dar după apariția acestei oportunități, designerii web au început să-l folosească la maximum și să obțină efecte complexe.

    Un tabel este creat folosind constructul

  • Și
    Și Și

    … sunt întocmite rânduri de tabel. Poate avea următorii parametri:

    aliniere - folosit pentru a specifica modul în care datele din interiorul celulelor sunt formatate orizontal: pot fi aliniate la marginile din dreapta, stânga sau centrate.

    valign - folosit pentru a specifica modul în care datele din interiorul celulelor sunt formatate pe verticală: se pot potrivi în partea de sus, de jos, la mijloc sau au o linie de bază comună.

    Celulele specifice sunt specificate folosind o etichetă

    , unde parametrii pot fi după cum urmează:

    width — setează lățimea celulei.

    colspan - determină câte coloane de tabel se va întinde celula.

    rowspan - determină câte rânduri de tabel se va întinde celula.

    nowrap - Dacă acest parametru este specificat, conținutul celulelor nu se va împacheta pentru a se potrivi cu lățimea celulei.

    bgcolor este un parametru acceptat de browserele moderne: specifică culoarea de fundal a celulei sub forma unui triplet rgb sau a unui nume simbolic.

    O altă etichetă pentru proiectarea celulelor tabelului este

    — necesare pentru a seta celulele antet. Se potrivește cu eticheta din toate punctele de vedere . Trebuie să fie în interiorul unei etichete
    Titlu

    Eticheta tabelului începe descrierea tabelului și poate avea următorii parametri:

    chenar — definește grosimea chenarului tabelului. Dacă este specificată o valoare zero, cadrul nu este afișat. Dacă acest parametru nu este specificat, se presupune că valoarea lui este zero (nu este afișat niciun cadru).

    lățime, înălțime - specifică dimensiunile tabelului dacă ar trebui să fie codificate.

    aliniere - determină modul în care tabelul trebuie aliniat: dreapta, stânga sau centrul paginii.

    cellspacing este numărul de puncte dintre celulele individuale din tabel.

    cellpadding - numărul de puncte dintre chenar și conținutul celulei.

    Folosind o etichetă

    , dar spre deosebire de acesta, conținutul este afișat cu caractere aldine și centrat.

    Dacă trebuie să setați titlul întregului tabel, utilizați eticheta

    , dar în afara descrierii celulei. Eticheta are un singur parametru:

    align - indică poziția antetului: poate fi în partea de sus sau de jos a tabelului.

    Rame (cadre)

    Un ajutor vizual puternic este așa-numitele cadre. Cadrele pot fi folosite pentru a împărți zona de afișare a browserului în părți separate care conțin documente diferite. În acest caz, este posibilă setarea conexiunilor între cadre, astfel încât selectarea unei legături într-un cadru să poată duce la afișarea documentului solicitat în altul. Acest lucru vă permite să creați documente care sunt foarte ușor de utilizat (dacă sunt utilizate incorect, puteți crea și unele foarte incomode). Cadrele sunt acceptate în prezent în cele mai recente versiuni ale browserelor, cum ar fi netscape navigator (de la versiunea 2.0) și ms Internet Explorer (versiunile 3.0 și mai recente), dar utilizarea cadrelor este în creștere în popularitate și se pare că la acestea vor fi adăugate mai multe. browsere în curând.

    Framework-urile sunt descrise într-un document HTML special numit Framework Description Document. Acest document conține o descriere a numărului, dimensiunii și poziției cadrelor, precum și adresele URL ale conținutului acestora. Nu puteți încerca să încadrați conținutul cadrelor în descriere, acestea trebuie să fie în documente separate.

    Când descrieți cadrele, eticheta înlocuit cu etichetă

    descrieri ale conținutului cadrelor

    Eticheta va fi ignorată de browser dacă este precedată de orice etichetă care ar fi găsită în mod normal în interiorul etichetei . Etichete poate fi imbricat, ceea ce permite, după cum va vedea Cititorul mai târziu, crearea unor structuri foarte complexe. Opțiuni de etichetare poate fi după cum urmează:

    rows="x1,x2,... sau x1%,x2%,... sau x1*,x2*,..." - acest parametru descrie cadrele ca șiruri de diferite înălțimi. Înălțimile cadrului sunt specificate printr-o listă de valori separate prin virgulă. Înălțimile sunt măsurate în puncte, ca procent din înălțimea totală a zonei de afișare sau ca valori relative. Suma înălțimilor tuturor cadrelor trebuie să fie egală cu înălțimea întregii zone de afișare. Dacă acest lucru nu se întâmplă, browserele înșiși ajustează valorile.

    cols="x1,x2,... sau x1%,x2%,... sau *" - folosit pentru a descrie cadrele ca coloane cu lățimi diferite. Folosit în același mod ca și parametrul rows.

    va seta două cadre orizontale, primul (sus) fiind de trei ori mai mare decât al doilea (jos).

    va defini trei cadre orizontale, primul (de sus) având o înălțime de 100 de puncte, al treilea (de jos) având o înălțime de 50 de puncte, iar al doilea (de mijloc) ocupând tot spațiul rămas.

    va defini două cadre verticale, primul (stânga) având o lățime de 70% din lățimea totală a zonei de afișare, iar al doilea (dreapta) - 30%.

    Eticheta este folosită pentru a seta conținutul cadrului . Parametrii pot fi după cum urmează:

    src - specifică adresa URL a documentului care ar trebui să fie afișată în cadru. Dacă parametrul nu este specificat, cadrul va rămâne gol.

    nume - valoarea acestui parametru specifică numele cadrului. Ulterior, cadrul poate fi referit cu acest nume utilizând parametrul etichetei țintă .

    defilare - arată dacă conținutul documentului din cadru poate fi derulat. Poate lua următoarele valori:

    da — conținutul cadrului POATE fi derulat.

    nu — conținutul cadrului nu poate fi derulat.

    automat - browser-ul decide dacă va afișa sau nu bara de defilare (în funcție de lungimea documentului). Această valoare este utilizată implicit.

    noresize - dacă acest parametru este specificat, utilizatorul nu va putea redimensiona cadrul. În mod implicit, utilizatorul POATE redimensiona cadrele afișate (de exemplu, trăgând chenarul cadrului cu un dispozitiv de indicare).

    marginwiph - indică cantitatea de margine orizontală din interiorul cadrului.

    marginheight - indică cantitatea de margine verticală din interiorul cadrului.

    marginwidth=5>

    numește cadrul myframe1 și afișează fișierul1.html în el, fără bară de defilare afișată, lățimea de umplutură orizontală setată la 5 puncte și utilizatorul este liber să redimensioneze cadrul.

    Exemplu mai complet:

    corespunde aproximativ următorului aspect al cadrelor din zona de afișare:

    Exemplu de aspect al cadrului

    Ce se întâmplă dacă browserul nu înțelege cadrul? Utilizatorul vede un ecran complet gol și nu poate ajunge la informațiile de care are nevoie. Cum să vă asigurați că nu apare o astfel de situație? Dezvoltatorii de extensii au anticipat această situație și au venit cu o etichetă al cărei conținut nu este niciodată afișat într-un browser care înțelege cadrul, în timp ce un browser „prost”, văzând o etichetă necunoscută, își va afișa sincer conținutul fără a folosi niciun truc. Această etichetă se numește

    Pentru a organiza conexiunile între cadre, dezvoltatorii au furnizat parametrul țintă pentru etichetă . Poate fi folosit și în etichete , Și
    .

    Imagini cartografice

    Un mijloc foarte puternic de organizare a legăturilor hipertext este așa-numitele „imagini cartografice” (imagini hărți). Sunt imagini cu zone sensibile, adică evidențierea diferitelor părți ale imaginii cu un dispozitiv de indicare are ca rezultat deplasarea prin hipertext în „direcții” diferite.

    Există două tipuri de imagini mapate: cele procesate pe server (partea server) sau pe client (partea client).

    Pentru a crea hărți pe partea clientului, o etichetă html numită . Sintaxa etichetei este:

    unde sunt parametrii etichetei poate fi asa:

    shape - Definește forma zonei active pentru hartă. Poate lua valorile rect, circle, poly, default, corespunzătoare zonelor dreptunghiulare, circulare, poligonale și, respectiv, implicite. Toate tipurile de zone, cu excepția celor implicite, necesită specificarea coordonatelor în atributul coords.

    coords - determină coordonatele zonelor. În funcție de tipul de zonă, poate avea următoarea formă: pentru dreptunghiular - valorile coordonatelor colțurilor din stânga sus și din dreapta jos, ("x1,y1,x2,y2"); pentru una circulară - coordonatele centrului și raza ("x,y,r"); pentru unul poligonal — o listă de coordonate de vârf (“x1,y1,x2,y2,x3,y3,...”);

    href - definește adresa URL la care se referă această zonă.

    noref - indică faptul că zona este „moartă”, adică nu există nicio legătură ascunsă în spatele ei.

    Pentru a utiliza o hartă locală pe o imagine în parametrul usemap al etichetei trebuie să specificați numele cardului. De exemplu:

    „http://www.yaxy.ru/rect/”>

    „http://www.yaxy.ru/circle”>

    href="http://www.yaxy.ru/poly”>

    înălțime=”480″ usemap=”#mymap”>

    va oferi aproximativ următoarea hartă în imagine:

    Exemplu de hartă din imagine

    Pentru a crea un card procesat pe server este necesară intervenția administrativă, deoarece fișierul de configurare de pe server va trebui schimbat pentru modulul cgi pentru procesarea informațiilor de pe card.

    Când utilizați servere web diferite, formatul descrierii hărții de pe server poate varia. Cele mai comune două formate provin de la serverele http ncsa și cern. Să dăm un exemplu de utilizare a unui card cu serverul ncsa httpd.

    Pe partea de server, fișierul (de exemplu) /usr/local/etc/httpd/conf/imagemap.conf:

    # aceasta este o hartă pentru serverul ncsa

    test_map: /home/joe/public_html/maps/test.map

    Puteți folosi acest card cam așa:

    inaltime=200 ismap>

    Forme

    Pentru ce sunt formularele?

    Un formular este un instrument prin care un document HTML poate trimite unele informații într-un punct predeterminat din lumea exterioară, unde informațiile vor fi procesate într-un fel.

    Este mult mai ușor să creezi un formular decât acel „punct din lumea exterioară” către care formularul va trimite informații. În cele mai multe cazuri, un astfel de „punct” este un program scris în Perl sau C. Programele care procesează datele trimise prin formulare sunt adesea numite scripturi CGI. Acronimul CGI înseamnă Common Gateways Interface. Scrierea de scripturi CGI necesită în majoritatea cazurilor o bună cunoaștere a limbajului de programare corespunzător și a capacităților sistemului de operare Unix.

    Recent, limbajul PHP/FI a câștigat o oarecare popularitate, ale cărui instrucțiuni pot fi încorporate direct în documente HTML (documentele sunt salvate ca fișiere cu extensia *.pht sau *.php).

    Formularele transmit informații către programele de gestionare sub formă de perechi [nume variabilă]=[valoare variabilă]. Numele variabilelor trebuie specificate cu litere latine. Valorile variabilelor sunt tratate ca șiruri de către handleri, chiar dacă conțin doar numere.

    Cum funcționează formularul

    Formularul se deschide cu o etichetă și se termină cu un semn. Un document HTML poate conține mai multe formulare, dar formularele nu trebuie să fie amplasate unul în celălalt. Textul HTML, inclusiv etichetele, poate fi plasat în formulare fără restricții.

    Eticheta
    poate conține trei atribute, dintre care unul este obligatoriu. Acestea sunt atributele:

    Atribut obligatoriu. Determină locul în care se află handlerul de formulare.

    Determină modul în care (cu alte cuvinte, folosind ce metodă de protocol de transfer de hipertext) datele din formular vor fi transferate către handler. Valorile valide sunt METHOD=POST și METHOD=GET. Dacă valoarea atributului nu este setată, se presupune implicit METHOD=GET.

    Stabilește modul în care datele din formular vor fi codificate pentru a fi transmise către handler. Dacă valoarea atributului nu este setată, valoarea implicită este ENCTYPE=application/x-www-form-urlencoded.

    Cea mai simpla forma

    Pentru a începe procesul de transfer al datelor din formular către handler, este nevoie de un fel de control. Crearea unui astfel de corp de control este foarte simplă:

    După ce a întâlnit o astfel de linie în interiorul formularului, browserul va desena pe ecran un buton cu inscripția Submit (a se citi „submit” cu accent pe a doua silabă, din engleza „submit”), atunci când se face clic, toate datele disponibile în formularul va fi transferat operatorului definit în etichetă .

    Inscripția de pe buton poate fi setată după cum doriți, introducând atributul VALUE=”[Inscripție]” (a se citi „valoare” cu accent pe prima silabă, din engleză „valoare”), de exemplu:

    Acum știm suficient pentru a scrie cea mai simplă formă. Nu va colecta date, ci pur și simplu vă va întoarce în partea de sus a paginii.

    Exemplul 11

    Cea mai simpla forma

    Inscripția plasată pe buton poate fi transmisă, dacă este necesar, operatorului prin introducerea atributului NUME=[nume] în definiția butonului (a se citi „nume”, din limba engleză „nume”), de exemplu:

    Când faceți clic pe un astfel de buton, handlerul, împreună cu toate celelalte date, va primi o variabilă buton cu valoarea Să mergem!.

    Un formular poate avea mai multe butoane de trimitere cu nume și/sau valori diferite. Managerul poate acționa astfel diferit în funcție de butonul de trimitere pe care a făcut clic utilizatorul.

    Cum colectează datele formularul

    Există și alte tipuri de elemente . Fiecare element trebuie să includă atributul NAME=[nume], care specifică numele elementului (și, în consecință, numele variabilei care va fi transmisă handlerului). Numele trebuie specificat numai cu litere latine. Majoritatea articolelor trebuie să includă un atribut VALUE="[valoare]" care specifică valoarea care va fi transmisă handler-ului sub acel nume. Pentru elemente Și , cu toate acestea, acest atribut este opțional deoarece valoarea variabilei corespunzătoare poate fi introdusă de către utilizator folosind tastatura.

    Tipuri de elemente de bază :

    Definește o fereastră pentru introducerea unei linii de text. Poate conține atribute suplimentare SIZE=[număr] (lățimea ferestrei de introducere în caractere) și MAXLENGTH=[număr] (lungimea maximă permisă a șirului de introducere în caractere). Exemplu:

    Definește o fereastră lată de 20 de caractere pentru introducerea textului. În mod implicit, fereastra conține textul Ivan, pe care utilizatorul îl poate edita. Textul editat (sau needitat) este transmis operatorului în variabila utilizator.

    Definește o fereastră pentru introducerea unei parole. Absolut asemănător cu tipul de text, doar că în loc de simboluri ale textului introdus apare asteriscuri (*) pe ecran. Exemplu:

    Definește o fereastră lată de 20 de caractere pentru introducerea unei parole. Lungimea maximă permisă a parolei este de 10 caractere. Parola introdusă este transmisă handlerului în variabila pw.

    Definește un buton radio. Poate conține un atribut bifat suplimentar (indică faptul că butonul este bifat). Într-un grup de butoane radio cu aceleași nume, poate exista un singur buton radio etichetat. Exemplu:

    9600 bps

    14400 bps

    28800 bps

    Definește un grup de trei butoane radio etichetate 9600 bps, 14400 bps și 28800 bps. Primul dintre butoane este inițial etichetat. Dacă utilizatorul nu verifică un alt buton, o variabilă de modem cu o valoare de 9600 va fi transmisă handlerului. Dacă utilizatorul verifică un alt buton, o variabilă de modem cu o valoare de 14400 sau 28800 va fi transmisă.

    Definește un pătrat în care se poate face un marcaj. Poate conține un atribut bifat suplimentar (indică faptul că pătratul este bifat). Spre deosebire de butoanele radio, un grup de pătrate cu același nume poate avea mai multe pătrate etichetate. Exemplu:

    Calculatoare personale

    Stații de lucru

    Servere de rețea locală

    Servere de Internet

    Definește un grup de patru pătrate. Al doilea și al patrulea pătrat sunt inițial marcate. Dacă utilizatorul nu face modificări, două variabile vor fi transmise handler-ului: comp=WS și comp=IS.

    Definește un element de date ascuns care nu este vizibil pentru utilizator la completarea formularului și este transmis operatorului neschimbat. Este uneori util să existe un astfel de element pe un formular care este reproiectat din când în când, astfel încât handlerul să știe cu ce versiune a formularului are de-a face. Puteți găsi cu ușurință și alte utilizări posibile. Exemplu:

    Definește o variabilă de versiune ascunsă care este transmisă handler-ului cu valoarea 1.1.

    Definește un buton care, atunci când este apăsat, readuce formularul la starea inițială. Deoarece nu sunt transmise date managerului atunci când se utilizează acest buton, este posibil ca un buton de resetare să nu aibă un atribut de nume. Exemplu:

    Definește butonul Ștergere câmpuri formular, care, atunci când este făcut clic, readuce formularul la starea inițială.

    Pe langa elemente , formularele pot conține meniuri

    Toate atributele sunt obligatorii. Atributul NAME definește numele sub care conținutul ferestrei va fi transferat către handler (în exemplu - adresa). Atributul ROWS stabilește înălțimea ferestrei în rânduri (5 în exemplu). Atributul COLS stabilește lățimea ferestrei în caractere (50 în exemplu).

    Text plasat între etichete , reprezintă conținutul implicit al ferestrei. Utilizatorul îl poate edita sau pur și simplu îl poate șterge.

    Este important să știți că literele rusești sunt în fereastră

    A b c d e