# 92: Individuaalsete galeriilehtede loomine - CSS-trikid

Anonim

Meil on siin töötamiseks natuke Photoshopi maketti, kui jätkame malli loomist üksiku galerii lehele.

Kõigepealt kujundasime lingid Järgmine ja Eelmine. Need asuvad galeriiribal absoluutselt paigutatud kastis, nii et me saaksime need lehele keskendada vaatamata teistele baaris juba asuvatele nuppudele ja muule. Nad võtavad sama klassi kui nuppu Esita üks, nii et seal on püsivust.

Järgmisena on meil see väga õhuke vasak veerg, kust teksti saada. Alustame 1/8 7/8 võrguga, kuid 1/8 on lihtsalt natuke liiga õhuke. Muudame selle väärtuseks 1/4 3/4, kuid see on liiga palju. Nii et nagu muinasjutuline beebikaru, oli ka 1/6 5/6 just paras.

Teeme selles kitsas veerus tüpograafiatööd, lisades pealkirja (an

muidugi, kuna see on lehe kõige olulisem pealkiri), kirjeldus ja muud jaotised. Suurem osa tüpograafiast langeb lihtsalt meie lihtsa ja kindla tüpograafiaseadistuse alusel paika.

5/6 ruudustik on kõik pildi jaoks. Tore ja suur, mis on suurepärane. Sellel on helehall taust, täpselt nagu piltide blogipostitustes (nt

).

Mõtleme sellele, kuidas silte kujundada veidi välja mõelda. Vaatame CodePenis ringi (siin on link sildile “tags”, META ALERT). Lõpuks arvame, et see on üle jõu ja jätame need tavalisteks linkideks.

Paneme nupu "täissuuruses" tööle ühel lihtsal viisil, mis vähegi võimalik, avame uue akna, mis on täissuuruses pildi mõõt ja kuvatakse selles pilt. See on nagu 2000-ndate alguse modaalkarp! Aga mulle meeldib. See on lihtne, see ei vaja hunnikut koodi (nagu valguskast vajaks) ja on ilmne, et temaga suhelda. See on veelgi parem, kui minult küsida.