# 074: CSSing poraštė, 4 dalis - CSS-gudrybės

Anonim

Šiame paskutiniame poraštės kūrimo ekrane dirbame apatinėje poraštėje, kur yra „CodePen“ ir „ShopTalk“ zonos.

Turime šiek tiek pakeisti HTML, nes suprantame, kad keturi gabalai išilgai dugno (logotipas, tekstas, logotipas, tekstas) būtų prasmingi kaip eilutė įterptinių blokų elementų, kurie yra sutelkti vienas į kitą ( vertical-align: middle;).

Mes susidūrėme su problema, kai tarp inline-block elementų yra papildoma erdvė, todėl naudojame šrifto dydį: 0; triukas iš šio straipsnio.

Galų gale mes gauname maketą, bet jūs iš tikrųjų nematote, kaip aš kritau į tikrus vaizdus. Kaip ir mes darėme su „Photostar“, aš sukuriu naują „Photoshop“ failą tik šiems poraštės logotipams. Tai tiesiog palengvina šių logotipų tvarkymą ir būsimus atnaujinimus. Aš taip pat gaminu juos 2x dydžio ir mažinu, kad jie gerai atrodytų „Retina“ ekranuose. Aš juos įmetu į mūsų turimas vietos rezervavimo ženklų atvaizdų žymas ir tai puikiai veikia.

Failai

  • 74 poraštės logotipai.psd.zip