Posts Tagged CSS

Онлайн-CSS помощьники (часть 1)

Posted by admin in CSS on 12.01.2010

Рад приветствовать, эта статья будет посвящена, в наше время весьма популярным онлайн CSS-генераторам, который до невозможности облегчают жизнь разработчику. Итак можно приступить.

Вот два неплохих CSS-генератора для работы со шрифтами.  В этих генераторах вы можете наглядно протестировать созданные вами шрифты, а во втором генераторе даже посмотреть как они будут выглядеть в Win XP, Mac, Win Vista.

http://csstypeset.com/

http://csstypeset.com/

http://www.typetester.org/ Там есть еще »

Популярность: 51% [?]

, ,

Комментариев нет

Закругление углов через CSS

Posted by admin in CSS on 24.12.2009

Здраствуйте. В этой статье разговор пойдет о «великом и могучем» CSS третьей версии. Как мы знаем то поддерживается он частично всеми браузерами, но совсем он не поддерживается Interne Explorer.

Эта статья предназначается менее опытным пользователем, или даже начинающим «покорителям» CSS. Итак можно приступить. Первым делом мы попробуем закруглить уголки у блока. Привожу листинг

#box {
  width: 300px;
 height: 150px;
 border: 1px solid #003c7b;
 background: #58a7f6;
 -webkit-border-radius: 10px; /* Отвечает за скругление уголков у Google Chrome и Apple Safari  */
 -moz-border-radius: 10px; /* Mozilla Firefox */
 }

Поддерживается Google Chrome, Mozilla Firefox, Apple Safari. Demo смотрим здесь

Эффект отбрасываемой тени:

#box {
            width: 300px;
            height: 150px;
            border: 1px solid #003c7b;
            background: #58a7f6;
            -webkit-border-radius: 10px;
            -moz-border-radius: 10px;
            /*Эффекты*/
            -webkit-box-shadow: #999999 3px 3px 3px;
            -moz-box-shadow: #999999 3px 3px 3px;
            box-shadow: #999999 3px 3px 3px;
        }

Поддерживается Google Chrome, Mozilla Firefox, Apple Safari.

Эффект отбрасываемой тени текстом

#box {
            width: 300px;
            height: 150px;
            border: 1px solid #003c7b;
            background: #58a7f6;
            -webkit-border-radius: 10px;
            -moz-border-radius: 10px;
            -webkit-box-shadow: #999999 3px 3px 3px;
            -moz-box-shadow: #999999 3px 3px 3px;
            box-shadow: #999999 3px 3px 3px;
            /*Эффекты*/
            text-shadow: #fff 3px 3px 3px;
        }

Популярность: 27% [?]

, , , ,

Комментариев нет