Vaizdo įrašų ekranai 2025, Sausis
Komentarų dizainas gali atrodyti labai paprastas. Ir tai yra! Bet manau, kad šiuo atveju veiksminga paprasta. Komentarai yra tokia svarbi CSS-gudrybių dalis "
Čia pradedame kasti „Photoshop“ ir kurti komentarų sritį. Mes pradedame nuo viršaus, turėdami omenyje asmeninius komentarus (priešingai nei
Pirmiausia apžvelgiame kai kuriuos niūrius darbus, kuriuos atlikau užkulisiuose, apibūdindamas kai kuriuos dalykus, kuriuos reikėjo atlikti. Kaip pridėti kitoje
Mes gana arti to, kad baigtume kurti svetainės „Snippets“ pagrindinį puslapį. Iškart pradedame keisti dalykus ir gauti daugiau informacijos "
„Atlikus“ fragmentų srities dizainą, dabar galime pereiti į tam tikrą interaktyvumą (skaityti: „JavaScript“). Pridedame labai šlubą ant nuorodų „
Dabar turime „Photoshop“ dizainą, kurį galima naudoti Snippets srities pagrindiniam puslapiui. Tai daug daugiau naršymo galimybių nei anksčiau, tačiau išlaiko vaivorykštę "
Laikas nerti į Snippets rajoną! Tai yra tikrasis jo turinio plotas. Antraštę jau turime vietoje. Fragmentų sritis yra gana populiari “.
Šioje ekrano juostoje apvyniojame „Almanacho“ skyrių. Almanache yra gana aiški hierarchija. Tai eina: Pagrindinis puslapis> „Almanach“ puslapis> Nuosavybė arba parinkiklis> "
Mes šokame į priekį tik paauglystėje. Tai gana išsami ekrano siuntimo serija, bet tai tik maždaug 40 valandų ir, žinoma, šis tikrasis projektas "
Mes jau dirbome vietoje vietiniame domene (v10.whatup). Dabar atėjo laikas pradėti naudotis „WordPress“. Dirbsime toliau vietoje “
Šiame puslapyje turime visą reikiamą turinį ir antraštę. Dabar galime pradėti „CSS“ nukreipti turinį į tą dizainą, kuriame mes dirbame “
Kai pradėsime dirbti „WordPress“, geriausia, jei užklijuosime tikslią tiesioginės duomenų bazės kopiją, kad galėtume dirbti vietoje. Kai kuriose svetainėse yra „
Dabar, kai kovojome, kad gautume tinkamą turinį „Almanacho“ pagrindiniame puslapyje, mes galime įsigilinti į tam tikrą stilių naudodami CSS. Mes nusprendėme eiti "
Šioje ekrano kopijoje mes daugiausia susiduriame su oranžiniu „Photostar“, kuris dominuoja poraštėje. Mes padarome žvaigždę atskirame faile „Photoshop“, kad galėtume padaryti
Įėjo „Alamanc“ antraštė, šį kartą iš Giovanni Difeterici. Norėdami pradėti, naudojame daugybę jau sukurtų metodų "
Pasirodė tinkinta vaizdo įrašų antraštės iliustracija, kurią šį kartą pateikė Alyssa Nassner. Mes praleidžiame šiek tiek laiko tvarkydami „Photoshop“ failą ir
Šiame paskutiniame poraštės kūrimo ekrane dirbame apatinėje poraštėje, kur yra „CodePen“ ir „ShopTalk“ zonos. Turime pakeisti HTML a "
Šiame ekrano vaizde mes sutelkiame dėmesį į linijas, esančias po nuorodomis viršutinėje poraštės dalyje. Mes kažkiek suklupome suprasdami, kokie dalykai turėtų būti "
Įstrigo fragmentų galva, šį kartą - Reaganas Ray'as. Šį kartą praleidžiame šiek tiek laiko „Photoshop“, šiek tiek maišydami daiktus, kad įsitikintume, jog mes
Įvedę poraštės HTML struktūrą, turime tai, ko mums reikia, kad pradėtume kurti stilių ir kad ši poraštė atrodytų taip, kaip suprojektavome „Photoshop“. "
Tai yra paskutinis „Photoshop“ darbas, kurį atliksime būtent dėl poraštės, prieš pereidami į jo kūrimą. Šioje ekrano kopijoje mes "
Mes dirbame kurdami poraštės „Photoshop“ dizainą. Greitas priminimas: Aš dirbu „Photoshop“, nes prieš peršokdamas jaučiuosi kūrybiškesnis “
Šioje ekrano juostoje mes užsiimame keletu „Photoshoppin“ verslų, pateikdami apatinę poraštę su nuorodomis į kitus du didžiausius mano projektus „CodePen“ “
Pradedame didelę kelionę, kuri yra poraštė! „CSS-Tricks“ visada turėjo didelę puošnią poraštę ir šis dizainas nebus išimtis. Tai nėra grynai "
Kai poraštės dizainas yra paruoštas naudoti „Photoshop“, galime pradėti kurti jį į savo statinį HTML ir CSS maketą. Pirmasis žingsnis yra
Mes turime dar vieną BSA zoną, kad galėtume integruotis į svetainę. Šis turėtų būti šiek tiek lengvesnis, nes jau turime „JavaScript“ ir tai tiesiog “
Mes turime maketą, kaip norime, kad mūsų „BuySellAds“ zonos atrodytų, todėl pradėkime jį kurti iš tikrųjų. „BuySellAds“ svetainėje pateikiamas mums reikalingas kodas “
Vienintelis dalykas, kurio dabar trūksta mūsų muitinės forumų antraštėje, yra ta dalis, kurioje iš tikrųjų sakoma „Forumai“! Nikas iliustravo ranką, laikančią reikiamą ženklą „
Dabar, kai tiksliai žinome, su kokiomis zonomis dirbame, grįžtame į „Photoshop“ ir tyčiojamės, kaip norime, kad šios skelbimų zonos atrodytų. Mes turime precedentą
Kaip žinote, kai kurie „CSS-Tricks“ skelbimai yra tarsi „patys tvarkomi“, pavyzdžiui, pagrindinis „Treehouse“ rėmėjas. Aš to prisiėmiau, nes tai tik vienas “