http://zdrojak.root.cz/ http://i.iinfo.cz/z/rss-88x31.gif 88 31 http://zdrojak.root.cz/n/css3/ Zdroják - tvorba webových stránek a aplikací cs Fri, 10 Feb 2012 09:43:22 GMT http://zdrojak.root.cz/zpravicky/urcujte-relativni-velikost-fontu-pomoci-css3/ Pokud budeme vytvářet kaskádové styly pro nový web, máme v podstatě dvě možnosti, jak zapsat velikosti fontů. Jedna z nich je definovat vše „napevno“, například pomocí rozměru v pixelech. Druhou možností je určit velikost relativně vůči... redakce@zdrojak.cz (Zdroják: Martin Pešout) Fri, 10 Feb 2012 09:43:22 GMT http://zdrojak.root.cz/zpravicky/urcujte-relativni-velikost-fontu-pomoci-css3/ http://zdrojak.root.cz/zpravicky/co-prinese-ie10-z-novych-standardu/ Microsoft zvedl hozenou rukavici a s Internet Explorerem opravdu „pohnul“. Verze 9 přinesla výrazný posun, a ve verzi 10 má být počet implementovaných standardů ještě vyšší. Na stránkách IE10 Guide for Developers naleznete seznam funkcí a... redakce@zdrojak.cz (Zdroják: Martin Malý) Wed, 14 Sep 2011 06:56:34 GMT http://zdrojak.root.cz/zpravicky/co-prinese-ie10-z-novych-standardu/ http://zdrojak.root.cz/zpravicky/dvanact-uzitecnych-triku-pro-css3/ Sbírek podle vzoru „N užitečných triků v CSS“ je už nepočítaně. Přidejme k nim další: http://www.web­designdev.com/web-development/12-really-useful-css3-tips-and-techniques redakce@zdrojak.cz (Zdroják: Martin Malý) Mon, 05 Sep 2011 07:17:20 GMT http://zdrojak.root.cz/zpravicky/dvanact-uzitecnych-triku-pro-css3/ http://zdrojak.root.cz/zpravicky/kuriozitka-hodiny-pomoci-css3/ Před víkendem drobná kuriozita – tyto hodiny od Andrewa Hoyera jsou tvořeny jen pomocí DIVů a vhodně použitých 3D CSS transformací (nutno použít prohlížeče, které tyto operace podporují; pokud takový nemáte, můžete vidět výsledek alespoň ve... redakce@zdrojak.cz (Zdroják: Martin Malý) Fri, 12 Aug 2011 06:33:14 GMT http://zdrojak.root.cz/zpravicky/kuriozitka-hodiny-pomoci-css3/ http://zdrojak.root.cz/zpravicky/podpora-html5-ve-visual-studiu-2010/ Microsoft vydal update pro VS2010, který přináší podporu pro HTML5, CSS3 a některá JS API. Podpora je jak pro Intellisense, tak pro kontrolu syntaxe. Za zmínku stojí i to, že budete-li psát CSS s vendor prefixy, rozpozná VS2010 i vendor prefixy... redakce@zdrojak.cz (Zdroják: Martin Malý) Mon, 20 Jun 2011 12:21:24 GMT http://zdrojak.root.cz/zpravicky/podpora-html5-ve-visual-studiu-2010/ http://zdrojak.root.cz/zpravicky/gridless-html5-sablona-pro-responsive-design/ Framework Gridless je, na rozdíl od podobných „boilerplates“, zaměřen především na mobilní weby a na responsive design, tedy takový návrh, který počítá s různými výstupními zařízeními. Nepoužívá proto designovou mřížku (grid), namísto CSS resetu... redakce@zdrojak.cz (Zdroják: Martin Malý) Tue, 14 Jun 2011 10:39:15 GMT http://zdrojak.root.cz/zpravicky/gridless-html5-sablona-pro-responsive-design/ http://zdrojak.root.cz/zpravicky/3d-pismo-v-css-podruhe/ Jak vidno, pokusy o vytvoření věrného 3D efektu u písma jen pomocí CSS neutuchají. Jeden pokus o 3D písmo jsme vám představili v lednu. I dnešní tip využívá stínování: How to create 3D text using CSS3. redakce@zdrojak.cz (Zdroják: Martin Malý) Mon, 30 May 2011 06:17:42 GMT http://zdrojak.root.cz/zpravicky/3d-pismo-v-css-podruhe/ http://zdrojak.root.cz/zpravicky/css-nastavovani-vlastnosti-objektu-a-la-photoshop/ Grafici dobře znají nastavování vlastností vrstev v Photoshopu – jednoduše lze nastavovat vržené stíny, barevné překryvy a další efekty. Podobné rozhraní nabízí CSS generátor Layer Styles. redakce@zdrojak.cz (Zdroják: Martin Malý) Tue, 17 May 2011 07:48:26 GMT http://zdrojak.root.cz/zpravicky/css-nastavovani-vlastnosti-objektu-a-la-photoshop/ http://zdrojak.root.cz/zpravicky/flux-slider-slideshow-s-akcelerovanymi-prechody/ Joe Lambert vytvořil Flux Slider, knihovnu pro vytváření obrázkových slideshow s přechodovými efekty. Flux Slider definuje přechody pomocí CSS3, takže jsou animovány pomocí HW akcelerace (tam, kde je podporována). redakce@zdrojak.cz (Zdroják: Martin Malý) Wed, 11 May 2011 06:49:28 GMT http://zdrojak.root.cz/zpravicky/flux-slider-slideshow-s-akcelerovanymi-prechody/ http://zdrojak.root.cz/zpravicky/galerie-vzoru-v-css3/ Pomocí CSS3 – kombinací barevných přechodů – lze vytvořit různé grafické vzory (pruhy, kříže, vlny apod.) Inspirovat se můžete v galerii vzorů. redakce@zdrojak.cz (Zdroják: Martin Malý) Tue, 03 May 2011 09:43:39 GMT http://zdrojak.root.cz/zpravicky/galerie-vzoru-v-css3/ http://zdrojak.root.cz/zpravicky/generator-css-pravidel/ Vendor prefixy přináší možnost používat CSS novinky, ovšem také nutnost každou vlastnost zapisovat několikrát. Práci mohou ulehčit preprocesory – nebo například online generátor CSS pravidel. redakce@zdrojak.cz (Zdroják: Martin Malý) Thu, 21 Apr 2011 09:16:29 GMT http://zdrojak.root.cz/zpravicky/generator-css-pravidel/ http://zdrojak.root.cz/zpravicky/kuriozni-vyuziti-css-stinovani/ Udělat elementu stín není s CSS3 problém. Na webu Widget naleznete 39 velmi kuriozních příkladů stínování (Webkit-only), které kombinují možnosti CSS3, k stínům přidává animaci či přechody, a výsledky jsou více či méně použitelné, každopádně ale... redakce@zdrojak.cz (Zdroják: Martin Malý) Thu, 21 Apr 2011 08:08:55 GMT http://zdrojak.root.cz/zpravicky/kuriozni-vyuziti-css-stinovani/ http://zdrojak.root.cz/zpravicky/dukladne-seznameni-s-yepnope-js/ Možná jste během posledních měsíců zaznamenali rostoucí popularitu javascriptové knihovny yepnope.js. Ta umožňuje podmíněné načítání skriptů a CSS souborů, ale nejen to. Co všechno knihovna dokáže a kdy se může hodit představuje článek na serveru... redakce@zdrojak.cz (Zdroják: Dalibor Šimáček) Tue, 22 Mar 2011 12:32:04 GMT http://zdrojak.root.cz/zpravicky/dukladne-seznameni-s-yepnope-js/ http://zdrojak.root.cz/zpravicky/nova-opera-11-10-beta-dale-vylepsuje-podporu-pro-css3/ Článek na serveru CSS3.info shrnuje další posun prohlížeče Opera v podpoře nových vlastností CSS3. Nová betaverze, představená před několika dny na konferenci SXSW, přináší mimo jiné podporu pro multi-column layout a barevné přechody... redakce@zdrojak.cz (Zdroják: Dalibor Šimáček) Tue, 22 Mar 2011 11:31:14 GMT http://zdrojak.root.cz/zpravicky/nova-opera-11-10-beta-dale-vylepsuje-podporu-pro-css3/ http://zdrojak.root.cz/zpravicky/inspirativni-galerie-webu-pouzivajicich-css-media-queries/ Na webu MediaQueri.es vznikla galerie nových webových stránek, používajících čím dál populárnější techniku media queries. Tato technika již na Zdrojáku byla popsána několikrát, např. v článku Martina Hassmana nebo článku Jana Sládka. Jedná se... redakce@zdrojak.cz (Zdroják: Dalibor Šimáček) Mon, 14 Mar 2011 07:00:00 GMT http://zdrojak.root.cz/zpravicky/inspirativni-galerie-webu-pouzivajicich-css-media-queries/ http://zdrojak.root.cz/zpravicky/jaky-je-stav-implementace-css3-v-prohlizecich/ Stavem implementace CSS3 v prohlížečích a rozporem mezi přáním vývojářů a realitou se zabývá článek na serveru Impressive Webs. redakce@zdrojak.cz (Zdroják: Martin Malý) Thu, 03 Mar 2011 08:41:35 GMT http://zdrojak.root.cz/zpravicky/jaky-je-stav-implementace-css3-v-prohlizecich/ http://zdrojak.root.cz/zpravicky/csspiderman/ Moderní webové technologie, počítané do rodiny HTML5, jsou poslední dobou velmi oblíbenou platformou pro ukázky nejrůznějších postupů, známých z Flashe, ovšem bez Flashe. Jednou z nich je i CSS3-man. Fungování animace je vysvětlené v článku. redakce@zdrojak.cz (Zdroják: Martin Malý) Tue, 18 Jan 2011 08:29:00 GMT http://zdrojak.root.cz/zpravicky/csspiderman/ http://zdrojak.root.cz/zpravicky/html5-co-nelze-otestovat/ Rychlý rozvoj webových technologií spolu s velkým procentem uživatelů se zastaralými prohlížeči přinesl nutnost testovat možnosti prohlížečů a nabízet podle nich alternativy. Velmi slušnou práci odvede například knihovna Modernizr. Přesto... redakce@zdrojak.cz (Zdroják: Martin Malý) Mon, 17 Jan 2011 11:39:51 GMT http://zdrojak.root.cz/zpravicky/html5-co-nelze-otestovat/ http://zdrojak.root.cz/zpravicky/3d-efekt-pro-text-v-css/ Pomocí kombinací více shadow lze v CSS nasimulovat „3D“ vzhled písma. Jak na to ukazuje tato demonstrace – 3D Text  redakce@zdrojak.cz (Zdroják: Martin Malý) Fri, 07 Jan 2011 08:22:18 GMT http://zdrojak.root.cz/zpravicky/3d-efekt-pro-text-v-css/ http://zdrojak.root.cz/zpravicky/stitky-v-css3/ Pokud se vám líbí grafické zpracování štítků, jaké používá např. služba Delicious, můžete se podívat, jak je vytvořit pomocí CSS3. Tutoriál přináší článek na serveru CSSGlobe. redakce@zdrojak.cz (Zdroják: Martin Malý) Thu, 06 Jan 2011 09:23:52 GMT http://zdrojak.root.cz/zpravicky/stitky-v-css3/ http://zdrojak.root.cz/zpravicky/detekce-otoceni-ipadu-v-css/ CSS3 implementované v prohlížeči Safari v zařízeních typu iPad umí správně zpracovat parametr „orientation“, což umožňuje tvůrcům přizpůsobit layout pro oba případy, tj. na výšku i na šířku. Jak na to ukazuje článek z blogu Cloud Four. redakce@zdrojak.cz (Zdroják: Martin Malý) Mon, 03 Jan 2011 10:52:00 GMT http://zdrojak.root.cz/zpravicky/detekce-otoceni-ipadu-v-css/ http://zdrojak.root.cz/zpravicky/jak-vytvorit-vanocni-ozdoby-v-css3/ Pak že vývojáři nemají vánoční témata:Na serveru SixRevisions vyšel článek, v němž je popsáno, jak vytvořit vánoční ozdoby v CSS3. Můžete se tedy inspirovat, pokud byste chtěli nějakou ozdobu vytvořit. redakce@zdrojak.cz (Zdroják: Martin Malý) Thu, 23 Dec 2010 07:26:52 GMT http://zdrojak.root.cz/zpravicky/jak-vytvorit-vanocni-ozdoby-v-css3/ http://zdrojak.root.cz/zpravicky/deset-alternativ-k-lightboxu-v-css3/ Jistě znáte efekt zvaný Lightbox, při němž se zobrazí obrázek v překryvné vrstvě, zatímco zbývající obsah „ztmavne“. Tento efekt se nejčastěji řeší pomocí JS pluginů, ale lze jej vytvořit i v čistém CSS3. Seznam deseti zajímavých řešení přinesl... redakce@zdrojak.cz (Zdroják: Martin Malý) Tue, 14 Dec 2010 08:35:45 GMT http://zdrojak.root.cz/zpravicky/deset-alternativ-k-lightboxu-v-css3/ http://zdrojak.root.cz/zpravicky/sencha-animator-animace-v-css3-snadno-jako-ve-flashi/ Sencha labs nabízí nástroj Animator, který umožňuje vytvářet animace v CSS3 pomocí „timelines“, podobně jako ve Flashi či v jiných animačních nástrojích. redakce@zdrojak.cz (Zdroják: Redakce) Mon, 01 Nov 2010 11:10:48 GMT http://zdrojak.root.cz/zpravicky/sencha-animator-animace-v-css3-snadno-jako-ve-flashi/ http://zdrojak.root.cz/zpravicky/ukazka-3d-transformaci-ve-webkitu/ Velmi zajímavá a působivá ukázka 3D transformací je na webu is-real a nese název Wonder Webkit. Demonstruje interaktivní 3D transformace, které prohlížeče s tímto jádrem již dnes zvládnou. redakce@zdrojak.cz (Zdroják: Martin Malý) Tue, 26 Oct 2010 12:04:29 GMT http://zdrojak.root.cz/zpravicky/ukazka-3d-transformaci-ve-webkitu/