Текст с оттенком и тенью

Тема в разделе "Веб-дизайн", создана пользователем krasniy, 28 сен 2009.

Статус темы:
Закрыта.
Модераторы: zek24
  1. krasniy

    krasniy

    Регистр.:
    21 апр 2006
    Сообщения:
    712
    Симпатии:
    112
    Скажите пожалуйста как сделать эффект тени и обьемности для текста как тут http://timvandamme.com/#networks
     
  2. rafic

    rafic

    Регистр.:
    14 май 2008
    Сообщения:
    477
    Симпатии:
    24
    Где именно тени и тд? я нечего не увидел перейдя по ссылке...
     

    Вложения:

  3. krasniy

    krasniy

    Регистр.:
    21 апр 2006
    Сообщения:
    712
    Симпатии:
    112
    В ФФ там обьемные буквы! неужели меня глючит?)
     
  4. rafic

    rafic

    Регистр.:
    14 май 2008
    Сообщения:
    477
    Симпатии:
    24
    Да, тебя глючит. Спецом открыл фф и посмотрел. Никаких объемных букв не увидел. Быть может это лаги самого ФФ, или у тебя установлены дополнительные плагины для отображения текста.
     
  5. Kon Dou

    Kon Dou

    Регистр.:
    19 мар 2009
    Сообщения:
    177
    Симпатии:
    40
    Нет, тебя не глючит. Вот CSS, который отвечает за текстовые эффекты на твоем примере, экспериментируй! ))

    color:#000000;
    text-shadow:0 1px 0 #FFFFFF;
     
    krasniy нравится это.
  6. rafic

    rafic

    Регистр.:
    14 май 2008
    Сообщения:
    477
    Симпатии:
    24
    Почему тогда у меня в ФФ и Опере не отображается тень? и остальные ранее описанные эффекты.
     
  7. krasniy

    krasniy

    Регистр.:
    21 апр 2006
    Сообщения:
    712
    Симпатии:
    112
    работает только в ФФ и Опере ? ))
     
  8. капрал

    капрал

    Регистр.:
    2 окт 2008
    Сообщения:
    337
    Симпатии:
    45
    есть еше один крутой способ:

    <a href="#">Главная<span>Главная</span></a>

    <style>
    a {display:block; position:relative; color:black; text-decoration:none;}
    a span {display:block; position:absolute; color:red; top:-1px; left:-1px;}
    </style>

    работает ВЕЗДЕ
     
  9. Kon Dou

    Kon Dou

    Регистр.:
    19 мар 2009
    Сообщения:
    177
    Симпатии:
    40
    При дублировании текстовых слоев заголовка, особенно написанных в H1, вы вступаете на тернистый путь поисковой оптимизации... Пес его знает, как яша отнесется к двум подряд идущим ключевым словам в таком заголовке? :p

    text-shadow появился еще в CSS2, в 1998 году, видит его ФФ>3.1, Opera>9.5, Chrome>2, почти правильно Сафари, ишаки не видят, у них как всегда... альтернативная цивилизация. У ишаков, видите ли, есть дерьмовый Drop Shadow Filter, но, подлюка, зато свой. :-]

    Синтаксис:
    .shadow { text-shadow: 1px 1px 1px #FFF; }

    Первый параметр — смещение по оси X (горизонталь) относительно текста (может быть отрицательным); положительное значение смещает тень вправо, отрицательное – влево;
    Второй параметр — смещение по оси Y (вертикаль) (может быть отрицательным); положительное значение смещает тень вниз, отрицательное – вверх;
    Третий параметр — радиус размытия, не обязательно;
    Четвертый параметр — цвет тени, не обязательно; если не указано, используется цвет текста.

    С text-shadow можно сделать множественные тени. Для этого, через запятую, нужно указать дополнительные значения, вот так:
    .shadow { text-shadow: 1px 1px 1px #FFF, 2px 2px red, 3px 3px 3px yellow; }

    Я так понимаю, на размытие влияет наличие включенного ClearType.
    Вопросы?
     
  10. mdss

    mdss ♖♘♗♕♔♗♘♖

    Moderator
    Регистр.:
    20 фев 2007
    Сообщения:
    1.126
    Симпатии:
    668
    и поисковые роботы за такое дают бан тоже везде ;)
     
Статус темы:
Закрыта.