Într-un document hipertext convențional, toate elementele se afectează într-un fel într-un fel în a-și forma aspectul. E. Un paragraf de text „schimburi“ urmeze o anumită distanță în jos imagine aliniată „forțele“ dreapta textul să curgă în jurul ei și m. N. Toate elementele formează împreună așa-numitul «HTML-flow-ului«sau»documentul de debit» (fluxul de documente).
Straturile, la rândul lor, sunt părți ale paginii care nu sunt incluse în fluxul HTML principal. Pentru fiecare dintre ei creează fluxul propriu, suplimentar, care nu afectează fluxul principal. În acest caz, acestea sunt afișate ca o regulă deasupra (partea superioară) a conținutului principal și sunt situate într-un loc strict definit, indicat în pixeli din colțul din stânga sus al paginii.
Cu ajutorul straturilor puteți face orice meniu pop-up / drop-down, afișaje translucide de elemente trase și alte așa-numite. «Ochi-bomboane».
Înainte de a părăsi NN4 (și eliberarea ulterioară MSIE4) există o versiune de lucru (proiect de lucru), caietul de sarcini intitulat «Poziționarea Elemente HTML cu Cascading Style Sheets» (cunoscut sub numele de CSS-P). Această specificație nu a devenit o recomandare, deoarece a devenit parte a nivelului CSS 1, dar poate fi găsită încă pe site-ul W3C.
Ce spune acest document? Descrie două metode (trei, dacă luați în considerare poziția comportamentului implicit - poziția statică) elemente de poziționare pe pagină: relativ și absolut.
În primul caz, atunci când un element este poziționat în raport cu alte elemente din fluxul HTML, acesta ia locul său obișnuit pe pagină și interacționează cu restul elementelor, ca și cum ar fi cel mai obișnuit element. Particularitatea este că poate fi descrisă "cu offset" în raport cu celelalte elemente ale paginii, adică relativ. În ciuda faptului că există multe exemple de utilizare a elementelor relativ poziționate, de regulă ele nu sunt utilizate în scopul propus. Personal, am nevoie de ele doar pentru a determina poziția unui anumit element de pagină în NN4.
Cel de-al doilea caz este absolut poziționat elemente și există straturi.
Este foarte simplu. Pentru a vorbi despre modul de utilizare a MSIE în MSIE
Deci, pentru a face un strat care se retrage la 100px din colțul din stânga sus al paginii, trebuie să scrieți următorul cod:
Acest cod va funcționa în toate browserele deasupra versiunii 4, chiar și în Opera și în NN6 / Mozilla.
Este posibil să faceți un strat chiar și după încărcarea finală a documentului. Desigur, acest lucru nu este la fel de nedureros ca în HTML. Nu este atât de compatibilă. I. nu este atât de simplu.
unde n este lățimea stratului în pixeli.
Spre deosebire de NN4, pentru MSIE4, straturile sunt aceleași elemente ca toate celelalte (adică nu sunt obiecte speciale). Dar din cauza modelului obiect slab, un strat nou trebuie adăugat la sfârșitul paginii ca un cod HTML normal, utilizând funcția specială insertAdjacentHTML (). Și pentru a indica faptul că acesta nu este un element static obișnuit, trebuie să specificați o poziționare absolută:
Cu toate acestea, dacă stilul nu specifică lățimea stratului (stil = "width: 150;"), atunci nu este determinată în funcție de conținut, în mod implicit este 100% din lățimea ferestrei.
Acestea sunt browserele MSIE5 + și NN6 / Mozilla. Din câte știu, în ciuda afirmațiilor sprijinului DOM în Opera nu va funcționa.
Pentru browsere, metodele de suport ale suportului DOM sunt create ca și în MSIE4 ca elemente HTML obișnuite, folosind doar metodele DOM. În acest caz, setarea proprietăților lor în multe privințe este similară cu modul în care sunt stabilite proprietățile din NN4.
Metoda DOM pentru crearea unui element este document.createElement (). Cu acest ajutor, puteți crea orice element în conformitate cu DTD-ul folosit în pagină. În cazul nostru, asta va fi
Noul element este creat și scris la variabila newLeer. Acum trebuie să specificați numele și poziția sa. Numele este specificat utilizând metoda standard setAttribute (). și poziția - prin obiectul de stil pe care orice element HTML îl are:
După aceasta, trebuie să creăm conținutul stratului. Dacă sunt elemente HTML, atunci trebuie să utilizați aceeași metodă document.createElement (). și dacă este doar text, atunci trebuie să creați un textNode cu metoda document.createTextNode ():
Ca rezultat, avem două variabile: newLeer și newLeerContents. Este necesar să plasați conținutul în strat și, în schimb, stratul în document. Pentru aceasta, există o altă metodă DOM - appendChild ():
Dar căutăm modalități ușoare? ;-)
Un exemplu de funcție care creează straturi pentru toate browserele nu va rezulta, dacă este necesar, nu am nicio îndoială că o veți putea scrie singur.