CSS 3.0 Maker: naklikejte si styly kompatibilní s CSS 3.0

Chcete na svém webu využít všech novinek, které přináší podpora kaskádových stylů ve verzi CSS 3 u současných webových prohlížečů? Než se naučíte nové definice z CSS 3 z paměti, pomůže vám klikací udělátko CSS Maker 3.0 na webu.
reklama

O CSS 3 se mluví již nějakou dobu, v posledních týdnech především v souvislosti s podporou nových vlastností kaskádových stylů v připravovaném webovém prohlížeči Internet Explorer 9. CSS 3 jsou však již podporovány i ve stabilních verzích běžně používaných dalších webových prohlížečů - Firefoxu, Chrome, Opery nebo Safari.

V čem je CSS 3 tak převratné? Přidává několik vlastností, díky kterým se již nemusíte namáhat s vyřezáváním nějaké grafiky z návrhu ve Photoshopu, ale necháte ji na vykreslení webovým prohlížečem. Nakódování grafické podoby stránky je tak rychlejší, web se navíc díky snížení počtu nezbytných obrázků rychleji načte.

CSS 3 přináší možnosti pro zaoblení rohů prvků na webu, stínování boxů a textu, otáčení textu, CSS animace nebo přechodové výplně. S takovou zásobou definic zapsaných několika značkami do CSS se již dá zbavit velkého množství nařezané grafiky. Tedy za cenu, že se vzdáte kompatibility se starými prohlížeči.

Online výroba CSS 3

Než nám všem přejdou nové zápisy definic pro CSS 3 do paměti, určitě řada z nás uvítá pomůcku, která dovede tyto nové definice vygenerovat po naklikání ve srozumitelném grafickém rozhraní. Jedno takové najdete na adrese www.css3maker.com. Aplikace běží ve webovém prohlížeči, funguje tedy online a nevyžaduje po vás nic instalovat ani žádnou registraci.

Na stránce CSS 3.0 Makeru se na jednotlivých záložkách přepněte na tu část vlastností CSS 3, kterou si chcete nadefinovat. Čili na přechodové výplně, změny tvarů, otáčení, stíny a další. V boxíku na levé straně upravíte vlastnosti daného efektu (barvy, velikost stínu, úhel náklonu atd.), uprostřed si prohlédnete výsledek a pokud vám vyhovuje, na pravé straně si zkopírujete vytvořený CSS 3 kód pro svůj vlastní projekt.

CSS 3.0 Maker

CSS 3.0 Maker

Příjemné je zobrazení ikonek webových prohlížečů, které již danou CSS 3 úpravu podporují. Nechybí ani informace o minimální verzi daného prohlížeče, ve kterém bude určitá CSS vlastnost fungovat.

CSS 3 je skvělá věc a nemůžu se dočkat, až bude bez problémů podporována ve všech aktuálních verzích běžně používaných webových prohlížečů. Řada věcí je totiž s pomocí CSS 3 neskutečně rychle vyřešena a kodér se tak může více věnovat jiným věcem.

Tagy
Autor článku: Jan Polzer

Tvůrce webů z Brna se specializací na Drupal a Symfony. Obojí také školím spolu se základy SEO. Jsem Acquia Certified Developer a Site Builder a napsal jsem několik knih o Drupalu. Ve volných chvílích cestuji a podnikám výlety. Více se dozvíte na mém firemním webu.

reklama

Komentáře k článku

Přidat komentář

Filtered HTML

  • Povolené HTML značky: <a href hreflang> <em> <strong> <cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <p> <br>
  • Řádky a odstavce se zalomí automaticky.
  • Web page addresses and email addresses turn into links automatically.

Odesláním komentáře souhlasíte s podmínkami Ochrany osobních údajů

reklama
Sledujte Maxiorla na Facebooku

Maxiorel na Facebooku

Poslední komentáře
reklama
Nové diskuze
reklama
Hosting pro Drupal a WordPress

Hledáte český webhosting vhodný nejenom pro redakční systém Drupal? Tak vyzkoušejte Webhosting C4 za 1200 Kč na rok s doménou v ceně, 20 GB prostoru a automatické navyšováním o 2 GB každý rok. Podrobnosti zde.

Knihy o Drupalu

Kniha Drupal 8 Kniha Drupal 7 333 tipů a triků pro Drupal
Více na KnihyPolzer.cz

@maxiorel na Twitteru

Maxiorel na Twitteru