Normal flux - HTML, CSS, JavaScript, Perl, PHP, MySQL

Blocuri conținute în fluxul normal de formatare aparțin contextului, care poate fi bloc, sau un șir de caractere, dar nu ambele în același timp sau altul. Unități structurale sunt implicate în blocurile de context formatat. Blocuri participă în linie, în contextul format siruri de caractere.

Contextul de formatare bloc

În contextul blocurilor succesive de blocuri formatate sunt dispuse vertical de la marginea superioară a containerului. Distanța verticală dintre cele două blocuri sora este determinată prin utilizarea „marjă“ proprietate. În contextul câmpului vertical blocuri formatate se suprapun între unități structurale adiacente.

În cadrul unităților de formatare fiecare margine exterioară segment din stânga al blocului vine în contact cu marginea din stânga a containerului un segment de linie (de la dreapta la stânga, atunci când formatarea atinge marginile din dreapta). Acest lucru este valabil și în prezența obiectelor mobile (deși conținutul unitate de suprafață poate fi redusă).

string formatare Context

În contextul șirurilor format blocuri dispuse orizontal, unul după altul, pornind de la marginea superioară a containerului. margini orizontale, borduri și padding în interiorul acestor blocuri sunt stocate. Exista diverse tehnici pentru unitățile de aliniament vertical: inferior sau pe marginea superioară sau la nivelul textului conținute în acesta. O regiune dreptunghiulară, care conține blocuri, formând o singură linie, numită unitate liniară.

Lățimea unității liniei este determinată de lățimea containerului. Înălțimea de matrice liniară la normele descrise în „Calcularea înălțimii liniilor.“ bloc liniar are întotdeauna o înălțime suficientă pentru a se potrivi toate blocurile. Cu toate acestea, ea poate fi mai mare decât cea mai mare unitate conținute în interior (de exemplu, în cazul în care blocurile sunt aliniate astfel încât tălpile de text sunt pe aceeași axă). În cazul în care înălțimea blocului B este mai mică decât înălțimea cutiei liniei în care se află, alinierea verticală a blocului B este definit în ultimul „alinia pe verticală“ proprietate.

Dacă mai multe blocuri șir nu poate sta într-o singură unitate de linie orizontală, acestea sunt distribuite pe două sau mai distanțate pe verticală blocuri liniare. Astfel, un paragraf este un set de blocuri liniare dispuse vertical. Unitatea de Linear nu este pe partea de sus a reciproc și nu trebuie să se diferențieze între orice intervale verticale.

În mod normal, marginea din stânga a unității liniare în contact cu marginea din stânga a containerului, iar marginea din dreapta - cu marginea din dreapta a containerului. Cu toate acestea, uneori, între muchiile lor sunt dispuse blocuri mobile. Prin urmare, deși într-un context de blocuri de format șir liniar de obicei sunt de lățime egală (egală cu lățimea containerului), încă poate varia în funcție de dimensiunea spațiului orizontal disponibil pentru a lăsa obiect mobil. Unități liniare, în același context, un șir de caractere de formatare variază adesea în înălțime (de exemplu, o linie poate conține grafică alungită, în timp ce celălalt - numai textul).

Când lățimea totală a șirului de blocuri dispuse într-o linie, care cuprinde mai puțin decât lățimea blocului liniar, distribuția orizontală a acestor unități este determinată utilizând proprietatea „text-align“. Dacă este setat să „justifice“, agentul utilizator poate crește lungimea șirului de blocuri.

Deoarece lățimea blocului șir nu poate să depășească lățimea blocului liniar, cutii inline lungi sunt împărțite în mai multe segmente, care sunt apoi distribuite unități liniare multiple. Atunci când o cutie integrată este împărțită în mai multe părți, în loc de partiționare a frontierelor de câmp și umplutură nu sunt afișate vizual. Formatarea câmpuri, frontiere și margini vor fi determinate nu este complet, dacă partiția este făcută într-o inserție bidirecțională.

Divizarea șir de unități pot fi, de asemenea, într-o unitate liniară utilizând procesarea de text bidirecțional.

Aici este un exemplu de construcție a unei cutii inline. Se adaugă următorul alineat (elementul creat P, aparținând HTML bloc la nivel de limbaj) implică text fără nume, în care se introduc elementele EM și puternic:

În acest propunere dragă
mai dedicat cuvinte.

Elementul P generează o unitate structurală care conține un șir de cinci blocuri, dintre care trei sunt anonime:

Nedenumite: „Acest“
EM: „propunerea“
Nedenumite: „dragă“
STRONG: „mai dedicat“
Unnamed: "cuvinte".

Pentru a formata paragraful, agentul utilizator pune toate cele cinci blocuri în unități liniare. În acest exemplu, un bloc este generat pentru elementul P, desemnează un container pentru unitățile liniare. În cazul în care containerul are o lățime suficientă, toate cutiile inline se potrivesc într-o singură unitate liniar:
În această propoziție, draga mea, câteva cuvinte selectate.

Altfel cutii inline sunt împărțite în porțiuni, care apoi vor fi distribuite în mai multe unități liniare. Paragraful precedent poate fi defalcat după cum urmează:

În această propoziție, draga mea,
câteva cuvinte selectate.
sau în alt mod:
În această propunere,
scumpe, oarecum
cuvinte selectat.

În acest ultim caz, blocul generat de elementul EM, a fost împărțit în două părți (le numesc „split1“ și „split2“). frontiere Field, padding sau elemente de design de text nu apar înainte sau după split2 split1.

Luați în considerare următorul exemplu:




Un exemplu de perete despărțitor în bloc liniar mai multe



aici mai dedicat cuvinte.



În funcție de lățimea elementului blocuri P pot fi alocate după cum urmează:


Câmpurile sunt situate la cuvântul „mai multe“ și după cuvântul „selectat.“
Indents sunt situate în partea de sus și de jos a cuvântului „unele“ și după aceea, deasupra și sub cuvântul „dedicat“. În ambele cazuri, cu trei laturi înconjurată de cuvintele dot-liniuță de frontieră.

poziționare relativă

După ce unitatea a fost plasată în conformitate cu un model de flux normal, acesta poate fi deplasat în raport cu poziția de referință. Această procedură se numește poziționare relativă. O astfel de deplasare a unui bloc (B1) nu are nici un efect asupra unei unități ulterioare (B2): blocul B2 este atribuit o poziție ca și în cazul în care nu a fost făcută B1 unitate de compensare, iar situația nu se schimbă, chiar dacă blocul B1 va fi mutat apoi. Rezultă că blocurile de impunere poate să apară la poziționarea relativă.

cutii poziționate relativ păstrează dimensiunea tipică a obiectelor, inclusiv pauzele de linie și spațiul rezervat pentru a le muta. Relativ unitate clasată atribuie un nou container pentru copii fluxul normal și descendenții plasați.

Element generează unitate relativ poziționate, dacă proprietățile „poziția“ set „relativă“. Offset este determinată folosind proprietățile „de sus“, „jos“, „stânga“ și „dreapta“.

Blocuri dinamice de mișcare relativ poziționate capabil să genereze efecte de animație în mediul de text (a se vedea. De asemenea, proprietatea „vizibilitate“). Poziționarea relativă poate fi folosit ca primar mijloc de a crea indici superioare și inferioare, cu excepția cazului în înălțimea liniei nu este reglată automat, împiedicând implementarea poziționării. Informații suplimentare pot fi găsite în secțiunea privind calculul înălțimea rândului.

Exemple de poziționare relativă prezentată în secțiune, în cazul în care o comparație a modelelor care descriu fluxul normal al obiectelor vehiculate și poziționarea absolută.

articole similare