Categories
HTML, CSS, JavaScript

CSS3 и сянката…

Тъй… ако обичате сянката като мен… значи ще ви е интересно как се слага тя под CSS3. Направо давам пример:

text-shadow: 1px 1px 1px rgba(0,0,0,.3);

такаам… сега:

  • – първият 1 пикселче означава отместването по хоризонтала на сянката
  • – вторият 1 пиксел (следвам примера) е отместването по вертикала. (точно като на background-position)
  • – третият пиксел е за блърването на сянката- колкото повече, толкова по голямо разпръксване ще има. Ако изпишем 0, то сянката ще е солиден цвят, т.е. няма да е размита и леко прозрачна.
  • – четвъртото – rgba(0,0,0,.3) е цвета. Но сега ще ме попитате, какво е “,.3” и защо точно rgba – защото с този четвърти параметър отбелязваме прозрачността – в случая опаситито ще е 30%.

До тук говорехме за сянката на текствоете. Но какво е при кутийките?!?

box-shadow: 0 1px 7px rgba(0,0,0,.2); – тук параметрите са в същата подредба и ознчават същото като text-shadow.

Английски вариант на статийката тук : http://owltastic.com/2009/12/shadows-and-css3/

10 replies on “CSS3 и сянката…”

Благодаря за интересната информация

Valuable information and excellent website you got here! I would like to thank you for sharing your ideas and time into the stuff you post!! Thumbs up

Someone I work with checks your site out quite often and passed it along to me. The writing style is solid and the content is relevant. Thank you for the insight you offer the subscribers!

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.