CSS režģa ceļvedis: izkārtojumu apguve ar režģa īpašībām

CSS režģa ceļvedis: izkārtojumu apguve ar režģa īpašībām
Tādi lasītāji kā jūs palīdz atbalstīt MUO. Veicot pirkumu, izmantojot saites mūsu vietnē, mēs varam nopelnīt filiāles komisiju. Lasīt vairāk.

Elementu izvietošana tīmekļa lapā var būt ļoti sarežģīta, strādājot ar sarežģītiem izkārtojumiem. Šeit noder CSS režģis. Tā ir izkārtojuma sistēma, kas paredzēta, lai vienkāršotu sarežģītu izkārtojumu izveides procesu.





Kā tas jums palīdz? Atšķirībā no tradicionālajām izkārtojuma metodēm, kas ļauj pozicionēt elementus tikai rindās vai kolonnās, CSS režģis piedāvā labāko no abām pasaulēm — 2D pieeju, izmantojot rindas un kolonnas.





Režģa konteineri un priekšmeti

CSS režģa rekvizītus var lietot diviem galvenajiem elementu veidiem: vecākiem un bērniem. Iestatot displeja rekvizītu uz “režģis” vecākelementam, tas pārveido šo elementu režģa konteinerā. Jebkurš pakārtotais elements šajā režģa konteinerā kļūst par režģa vienumu, pārmantojot lietotās režģa īpašības.





Lūk, kā tas tiek attēlots:

jums ir galddators, kuru vēlaties jaunināt. jūs pievienojat vairākus iekšējos komponentus
 Režģa konteiners ar četriem režģa elementiem

Režģa vienums var kļūt arī par režģa konteineru. Tagad varat atsaukties uz izkārtojumu kā ligzdotu režģi — režģi režģī. Galvenais režģa konteiners tagad tiek saukts par ārējo režģi, bet vienumam pagriezts režģa konteiners kļūst par iekšējo režģi.



Katrs no šiem režģiem darbojas neatkarīgi no otra, kas nozīmē, ka iekšējam režģim iestatītās īpašības neietekmē ārējā režģa izkārtojumu un otrādi.

Lūk, kā tas izskatās:





 Režģa konteiners ar četriem vienumiem, ligzdots režģa konteiners ar trim vienumiem.

Ir svarīgi apgūt attiecības starp režģa konteineriem un priekšmetiem būvējot divdimensiju izkārtojumus efektīvi.