Frontiere - html, css, javascript, perl, php, mysql

Pentru a seta limitele celulelor de tabelă în CSS, se utilizează două modele. Primul model este cel mai potrivit pentru așa-numitele limite separate în jurul anumitor celule, cealaltă este aplicată la limitele care rulează de la o margine a mesei la cealaltă. Oricare dintre aceste modele vă permite să creați multe stiluri diferite de granițe, astfel încât alegerea modelului este determinată numai de gustul creatorului mesei.







Valoare: colaps | separate | moșteni
Valoarea inițială: colaps
Domeniul de aplicare: elementele "tabel" și "inline-table"
Moștenire: da
Procentaje: N / A
Dispozitive: vizuale

Această proprietate vă permite să selectați modelul limitelor tabelului. Valoarea "separată" înseamnă un model cu limite separate. Valoarea "colapsului" specifică un model cu granițe intersectate. Aceste modele sunt descrise mai jos.

Modelul granițelor individuale

Semnificație: ? | | moșteni
Valoarea inițială: 0
Domeniul de aplicare: elementele "tabel" și "inline-table"
Moștenire: da
Procentul de repartizare: nedeterminat
Dispozitive: vizuale

Dacă se specifică o lungime, aceasta indică distanța dintre limitele celulelor vecine. Dacă este specificată o lungime, aceasta determină distanțele orizontale și verticale. Dacă sunt specificate ambele valori, prima determină distanța orizontală, iar cea de-a doua determină distanța verticală. Lungimile nu pot fi negative.

În acest model, fiecare celulă are propriile limite. Proprietatea "distanțare la frontieră" definește distanța dintre marginile celulelor vecine. Această distanță este umplută cu fundalul elementului de tabel. Rândurile, coloanele, grupurile de rânduri și grupurile de coloane nu pot avea margini (adică agenții utilizator trebuie să ignore proprietățile de frontieră pentru aceste elemente).

Tabelul prezentat în figura de mai jos poate fi creat folosind următoarea foaie de stil:

Un tabel în care valoarea "spațiu de frontieră" este setată la o valoare specifică. Rețineți că fiecare celulă are o limită proprie, iar tabelul are o limită separată.

Frontierele din jurul celulelor goale: proprietatea celulelor goale

Valoare: arată | ascunde | moșteni
Valoare inițială: arată
Domeniu de aplicare: elemente ale "celulei de masă"
Moștenire: da
Procentul de repartizare: nedeterminat
Dispozitive: vizuale

Într-un model cu granițe separate, această proprietate controlează reprezentarea granițelor în jurul celulelor care nu au conținut vizibil. Se crede că nu există conținut vizibil în celule și celule goale pentru care proprietatea "vizibilitate" este setată la "ascunsă". Simbolurile " "Și celelalte simboluri reprezentând spațiul gol, cu excepția caractere ASCII CR (" D "), LF (" A "), tab (" 9 ") și spațiu (" 20 „), sunt considerate a fi conținuturi vizibile.

Dacă această proprietate este setată să se afișeze, este afișată o margine în jurul celulelor goale (ca în jurul celulelor obișnuite).

Valoarea "ascunde" înseamnă că nu vor exista granițe în jurul celulelor goale. În plus, dacă toate celulele de pe linie au această proprietate "ascundă", iar celulele nu au conținut vizibil, întregul șir va fi executat în funcție de valoarea "display: none".

Conform următoarei reguli, limitele vor avea toate celulele:

Model cu limite intersectate

Într-un model cu granițe intersectate, puteți specifica limitele care înconjoară grupul de celule, rând, grup rând, coloană sau coloană, integral sau parțial. În acest fel, puteți seta limitele pentru atributul HTML "rule".

Limitele sunt aliniate în centrul grila dintre celule. În cazul unui număr impar sau unități discrete (pixeli, puncte imprimantă), agenții utilizator trebuie să selecteze linia de frontieră corespunzătoare.







Figura de mai jos prezintă relația dintre lățimea mesei, lățimea marginilor, câmpul din interiorul celulelor și lățimea celulei. Această relație este reprezentată de următoarea ecuație, care se aplică fiecărui rând din tabel:

line_width = (0.5 * border_width0) + left_field_internal_table1
+ width1 + right_field_internal_table1 + border_width1 +
left_field_in_table2 +. + dreapta_field_internal_table +
(Lățime de margine de 0,5 *)

Aici, n este numărul de celule dintr-un rând, iar limita de lățime este limita dintre celulele i și i + 1. Rețineți că numai una din cele două margini exterioare este inclusă în lățimea mesei; cealaltă limită se află în zona câmpului.

Schema lățimii celulelor, a granițelor și a câmpurilor din celule.

Rețineți că în acest model, lățimea mesei include jumătate din limita mesei. În plus, în acest model, tabelul nu are câmpuri înăuntru (dar există câmpuri).

Rezolvarea conflictelor dintre granițe

În modelul cu limite care se suprapun la fiecare capăt al celulei de delimitare poate fi dată proprietățile diferitelor elemente, care sunt situate la marginea (linii de celule, un grup de rânduri, coloane și grupuri de coloane din tabel în sine), iar aceste limite pot varia în lățime, stil și culoare. În acest caz, pentru fiecare margine, se folosește un stil de margine, care "captează vizualizarea", cu excepția faptului că marginea nu este afișată dacă stilul de stil este "ascuns".

Ce tip de frontieră va "beneficia" în cazul unui conflict este determinat de următoarele reguli:

  1. Frontierele ale căror proprietăți "în stil de frontieră" sunt setate la "ascunse" au prioritate față de toate celelalte frontiere în conflict. Toate celelalte limite la locația specificată nu sunt afișate.
  2. Frontierele care au stilul "none" au cea mai mică prioritate. Numai dacă proprietățile de frontieră ale tuturor elementelor care aparțin acestei margini au valoarea "none", nu va exista nici o margine (însă nu uitați că valoarea "none" este folosită pentru stilul de margine implicit.)
  3. Dacă nici unul dintre stiluri nu are o valoare "ascunsă" și cel puțin una dintre ele are o altă valoare decât "niciuna", limitele mai largi sunt "câștigate". Dacă mai multe limite de proprietăți „border-width“ au aceleași valori, stiluri sunt aplicate în următoarea ordine:,, „punctată“, „bun inceput“ „dubla“ „solid“ „punctată“, „creasta“, „canelură“ și stilul cea mai mică prioritate a "inset".
  4. Dacă stilurile de margine diferă doar în culori, atunci stilul specificat pentru celulă are prioritate față de stilul rândului, stilul liniei este deasupra grupului rând, coloanei, grupului de coloane și stilului de tabelă.

Următorul exemplu arată modul de aplicare a acestor reguli de ierarhie. Ca urmare a utilizării foii de stil:














1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

următorul tabel va fi prezentat:

Un exemplu de tabel cu limite intersectate.

Următorul exemplu prezintă un tabel cu linii orizontale care separă rânduri. În partea de sus a mesei, se specifică valoarea "ascunsă", ceea ce asigură faptul că nu există nici o limită superioară pe prima linie. Ca rezultat, se va folosi atributul "rules" HTML 4.0 (rules = "rows").

Tabel cu linii orizontale care separă liniile.

În acest caz, puteți obține același rezultat fără a specifica valoarea "ascunsă" pentru marginea întregului tabel, dar numai pentru primul rând. Puteți utiliza orice metodă.

Iată un alt exemplu de suprapunere a granițelor:

Tabel cu două limite interne lipsă.






foo bar
foo bar

Stiluri de frontieră

Semnificația anumitor valori ale proprietății "stilului de graniță" în raport cu tabelul și cu alte elemente este diferită. În lista de mai jos, aceste valori sunt marcate cu un asterisc.

Similar cu valoarea "niciunui", dar într-un model cu granițe suprapuse, are prioritate față de orice alte limite (a se vedea secțiunea privind conflictele de frontieră).

Limita este reprezentată de un număr de puncte.

Limita este reprezentată de o serie de segmente liniare scurte.

Frontiera este reprezentată de un singur segment al liniei.

Limita este reprezentată de două linii continue. Suma grosimii celor două linii și

distanța dintre ele este egală cu valoarea "width-width".

Bordajul pare deprimat.

Spre deosebire de "groove", granița pare convexă.

Într-un model cu limite separate, totul pare deprimat. Într-un model cu granițe intersectate, această valoare oferă același efect ca și valoarea "groove".

Într-un model cu granițe separate, întregul bloc pare convex. Într-un model cu granițe intersectate, această valoare dă același efect ca și valoarea "creasta".







Trimiteți-le prietenilor: