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.
Zopár Gallagherových fiddlov:
:: jsfiddle.net/necolas/hjMqh/
:: jsfiddle.net/necolas/xCfeH/
:: jsfiddle.net/necolas/uzaG9/
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?

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 :)
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:

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 ;)

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ť ;)

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

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

Dakujem za velmi dobre video a velmi uzitocne Gallagherove fiddle.

:after a :before som uz par krat vyuzil, cize paradne osviezenie pamate. Ale z tych CSS ikoniek padam na rit najviac :)

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 :)
Novinky
2 rokmi
Aprílové vtípky: Výběr toho nejlepšího kolem počítačů, internetu a techniky
Výběr nejlepších aprílových vtípků 2019
2 rokmi
Fotky Google sa učia lepšie pracovať s dokumentmi
Spoločnosť Google prostredníctvom svojho účtu na sociálnej sieti Twitter oficiálne predstavila novú funkciu svojej aplikácie Fotky Google.
2 rokmi
Gmail dovoľuje naplánovať poslanie emailu neskôr
Spoločnosť Google dnes oznámila pridanie funkčnej novinky do svojej populárnej webmailovej služby Gmail, možnosť naplánovať poslanie emailu na neskôr.
3 rokmi
Používatelia Chrome začali prechádzať na nový rýchlejší Firefox, avizujú dáta Mozilly
Nový lepší a rýchlejší prehliadač Firefox 57 Quantum vyúsťuje zrejme do viac používateľov prechádzajúcich respektíve vracajúcich sa na tento prehliadač z iných prehliadačov, na osobných počítačoch aj smartfónoch.
3 rokmi
Briti dokončili kúpu SK-NIC-u. Nové .sk domény nechávajú za 8.4 eur
Predaj správcu slovenskej domény .sk, SK-NIC, bol dokončený a novým majiteľom po telekomunikačnej skupine Danubiatel, do ktorej patrí napríklad Swan a 4ka, je britská spoločnosť CentralNic.
Staršie novinky »TOP dlhšie
- 01 Farbičky v HTML a CSS, alebo? (868x)
- 02 Tiché COMBO Logitech MK295 (717x)
- 03 Kamery, cloud a bezpečnosť (703x)
- 04 Kingston uvádza 128GB verziu šifrovaného USB (687x)
- 05 Pochopte, ako vytvoriť virtuálny obchod v 6 krokoch (627x)
- Aj ty môžeš byť najčítanejší. Napíš článok »
TOP tento mesiac
- Aj ty môžeš byť najčítanejší. Napíš článok »
Nové články:
- 14.Kingston uvádza 128GB verziu šifrovaného USB
sep - 10.Tiché COMBO Logitech MK295
sep - 24.Farbičky v HTML a CSS, alebo?
aug - 23.Pochopte, ako vytvoriť virtuálny obchod v 6 krokoch
aug - 29.Kamery, cloud a bezpečnosť
jul - Viac »
- Aj ty môžeš byť najčítanejší. Napíš článok »
Pekné veci
Pekné veci
Pekné veci
Pekné veci
Posledné komentáre
- Pokiaľ používaš nejaký lepší bitmapový editor, napr. Photoshop, a chceš robiť retuše, ed...
- Veľmi dobrý článok a pre začiatočníka úplne odrazový mostík. https://ludwaismania1.blogs...
- Nova international a prima lus majú vysporiadané pravs ale aj CNN prima News
- Tv Joj nijako neobmedzuje šírenie médii, ktoré majú vysporiadané licenčné práva pre Slov...
- Nech televizie vrátia naspäť originál verzie a tie internationali nech zrušia. Každý si ...
Kritika
Vieš ako robiť veci lepšie? Pomôž našim odvážnejším členom a skritizuj im projekty!
Reklama
Slovenská IT komunita
Seriály zo Zajtra.sk
· Ako písať blog
· Ako sa stať PHP ninja s Yii Frameworkom
· Aplikácie pre Facebook
· CSS triky
· iOS vývojára príhody a skúsenosti
· Jednoduché programy, ktoré vám ušetria čas
· Modelovanie webového sídla
· Nauč sa CodeIgniter [HD]
· Nauč sa jQuery [HD]
· Nette PHP framework
· OOP v Javascripte
· Programujeme v Jave
· Programujeme v Lazaruse
· Programujeme v Pythone
· Robíme Eshop v ASP.NET Web Pages
· Slovenskí iOS developeri
· Webdizajn krok po kroku
· Yablkov TurboTip [HD]
@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 ;)