spájame
slovenskú
IT komunitu
pridaj sa
Registrácia · Login
Roman Hraška 15.12.2011, článok je súčasťou seriálu Yablkov TurboTip [HD]
Hodnoť článok:
1 0

Videocast: TurboTip 7 - CSS :before :after pseudo elementy

Mini-video-tutoriály na všetko webové. S Yablkom. Dnes CSS pseudo elementy. Pretože je s nimi prdel.

Kuk na nicolasgallagher.com. Tento chlapík, okrem iného, spravil set ikoniek.
Čisto pomocou CSS.
Skrz :before a :after pseudo elementy.
Ok, teraz video.

720p, inak síce nikto nezabije šteniatko, ale vy prd uvidíte.

Yablkov TurboTip 7 - CSS :before :after pseudo elementy

Recorded on a device assembled in China.

zahraj sa s kódom »

Zopár Gallagherových fiddlov:
:: jsfiddle.net/necolas/hjMqh/
:: jsfiddle.net/necolas/xCfeH/
:: jsfiddle.net/necolas/uzaG9/

ak ma chceš podporiť, behni na yablko.sk a možno spravím nový seriál či dva:)

Sledujte yablka skrz twitter - @yablko - pre informácie o nových videách, humor, ktorý baví len jeho a občasné nervové zrútenie.

* * *

Páči sa ti Yablkov TurboTip?

Roman Hraška Roman Hraška

Robí s webom a občas o tom napíše. Nekomplikuje jednoduché a snaží sa neznieť príliš dôležito, pretože nie je. Medzi jeho záľuby patria jeho záľuby a tautológia. Nájdeš ho na brm.sk a obsmŕda aj na twitteri, ako @yablko.

Skús moje seriály: Nauč sa jQuery, Nauč sa CodeIgniter a Yablkov TurboTip. Ak ma chceš dohnať k tvorbe nových seriálov, behni na yablko.sk :)


Hodnoť článok:
1 0


14 komentárov k článku:

Komentovať môžu iba prihlásení

Zaregistruj sa cez bezplatnú registráciu alebo použi login cez Facebook (FB Connect)

Prihlás sa tu, ak už máš profil na Zajtra.sk:


Zabudol som heslo

0 0 viťo 18.12.2011 14:53:10
@nomak
internet brzdia webdizajneri, ktori sa IEcku sustavne podriaduju ;)
a hlavne my slovaci stojime, opakujeme to iste sustavne dokola, nic nove.. berte si priklad od peta drusku ;)
0 0 Nomak 18.12.2011 14:16:09
kodovanie nebrzdí slovensko ale Internet explorer! :D

(mimochodom ... takí Česi ... nemôžem sa na to pozerať)
0 0 viťo 17.12.2011 22:32:43
@roman
klasika, my slovaci stagnujeme.. svet napreduje.. a uz hej, napriklad taki cesy :)
0 0 Roman Hraška 17.12.2011 17:06:41
viktor, evidentne je veľa vecí, ktoré nechápeš a garantujem ti, že v turbotipe príde ešte veľa ďalších, ktoré už dááávno ovládaš a teda zmysel ich vysvetľovania nepochopíš

preto ti radím - nechaj nás malých debilkov hrať sa s vecami, ktoré už dávno fungujú a ty sa venuj niečomu prínosnejšiemu

ale skúsim ešte posledný krát k tebe prehovoriť ako k človeku: to, že ty niečo ovládaš neznamená, že to ovládajú všetci. To, že ty to považuješ za zbytočné, neznamená, že to za zbytočné považujú všetci. A ak sa nájde čo i len JEDEN človek na tejto planéte, kto si z toho niečo odnesie, stojí za to hodiť to sem. Pre mňa, pre neho. Pre teba očividne nie. Ale planéta sa netočí okolo teba, že ;)
0 0 viťo 17.12.2011 16:42:11
taketo veci uz funguju davno, fakt nechapem nasilu opakovanie toho, co uz je xxxx rokov zname
0 0 Roman Hraška 17.12.2011 15:22:27
ono to normálne netrvá tak dlho, ale evidentne nie som žena a som blbý keď mám robiť x vecí naraz:) rozmýšľať, kecať a ešte aj písať je dosť na moju maličkú gebulu

v textových editoroch zen coding mám, ale (hlavne pre týchto jsbin srágorách) si budeme musieť zvyknúť na to, že tam budem takto trapošiť ;)
0 0 Nomak 17.12.2011 15:15:12
pekne ... no zatiaľ myslím kvôli tej ie7 menej použiteľné už by to mohlo vymrieť konečne :D (nam koderom ktorý si to nemožu dovoliť bohužial ostáva pracovať s li background)

inač na html by som ti odporúčal pozrieť si zen coding a nestrácať čas vypisovaním napr li ;) mne to pri tvorbe layoutu šetrí more času (polovica tutorialu bolo sledovanie vypisovania trivialneho html čo si mylsím nebolo jeho ulohou)

ale pekne ja sa teším na každý tvoj tut :P hlavne dik za jQuery
0 0 Stanislav Červeňák 17.12.2011 14:35:23
takéto poradie ma nenapadlo :D dikes
0 0 Stanislav Červeňák 16.12.2011 18:32:29
jeden postreh ...novopridané :after :before elementy nieje možné kopírovať :D a ešte by ma zaujímalo či existuje aj nejaká možnosť naviazania :hover na tie elementy typu :after:hover ...pri zoznamoch respektíve menu by sa to dalo využiť na menenie obrázkov pri nájdení myšou
0 0 Tomas Misura 15.12.2011 20:56:24
Dakujem za velmi dobre video a velmi uzitocne Gallagherove fiddle.
0 0 Matúš Jančík 15.12.2011 16:17:24
:after a :before som uz par krat vyuzil, cize paradne osviezenie pamate. Ale z tych CSS ikoniek padam na rit najviac :)

0 0 Roman Hraška 15.12.2011 14:00:41
nebolo:) ale dík za koment
0 0 Michal Gašparík 15.12.2011 13:58:34
Pekne vysvetlenie pseudo elementov :before a :after.
Na tie zoznamy sa však dá nastaviť CSS vlasnosť list-style-image:url('nieco.gif'); ale viem že to nebolo cielom :)
Zajtra.sk > Programovanie > Seriály > Videocast: TurboTip 7 - CSS :before :after pseudo elementy


Kritika

Vieš ako robiť veci lepšie? Pomôž našim odvážnejším členom a skritizuj im projekty!

Reklama

Seriály zo Zajtra.sk

Reklama