Blog Archives: css3

css transforms ja webkit translate 3d

  |   by kadriad   |   Blogi, css  |  No Comments

Täiendus: Kuidas teha, et menüüpunkti alla tuleks animeeritud joon hover puhul. Kood on siin: a { text-decoration: none; display: inline-block; } a:after { content: ''; display: block; border-bottom: 1px solid blue; width: 0; -webkit-transition: 0.5s ease; transition: 0.5s ease; } a:hover:after { width: 100%; } <a href="#">Longer Link</a><br> <a href="#">Link</a> Õpetus on siin: http://jsfiddle.net/46a8u/27/ Siin […]

Read more »

css3 fluid design

  |   by kadriad   |   Blogi, css  |  No Comments

Siin on ülevaade css 3 fluid design kohta, teise nimega responsive design. Samuti ka media queries ja seadme laius jne. http://coding.smashingmagazine.com/2010/07/19/how-to-use-css3-media-queries-to-create-a-mobile-version-of-your-website/

Read more »

Elementaarsed css nipid

  |   by kadriad   |   Blogi, css  |  No Comments

Panen siia aja jooksul kirja mõningaid lihtsaid tõdesid. Kui on vaja teha kolmnurkset sikksakk alumist äärt, siis kood on siin: #branding{ box-sizing: border-box; background-clip: padding-box; border-bottom: 10px solid transparent; z-index: 2; -webkit-filter: drop-shadow(rgba(0, 0, 0, 0.55) 0px 1px 2px); } #branding:after { content: ''; position: absolute; display: block; width: 100%; height: 10px; bottom: -10px; left: […]

Read more »

css3 generaator

  |   by kadriad   |   Blogi, css  |  No Comments

Üks tore koht, kus saab genereerida ja vaadata css3 võimalusi: http://css3generator.com/

Read more »