Приблизительное время чтения: 2 минут

Как многие знают, CSS3 Они еще не были полностью реализованы в браузере, мы не служим в первой части этого урока!. Уже реализованы на конкретных CSS2 Это свойство "контур». Давайте посмотрим на пример:

p.test {
    border: 1px solid #000000;
    outline: 3px solid #6374AB;
    width: 20em;
}

Эти несколько строк накладывают на создание черная граница пикселя вокруг в пункте, и контур (внешний по отношению к краю) цвет «# 6374ab» три пикселя. Он также указывает ширина пункта. Результат заключается в следующем:

Но что мы должны делать, если мы служим эффект контура применяется к границам слов? В этом случае мы должны служить CSS3, как уже говорилось, являются неполными реализацию и еще не стандарт, но так как это только визуальный эффект, применяемый к тексту вы просто платите немного «внимание, потому что они продолжают читать содержимое.

Техника здесь ниже, не может быть наиболее "ортодоксальный», но, конечно, решает проблему. С помощью CSS3, вы можете создать один или несколько затенение текста, и мы создаем восемь различных (все кардинальные и промежуточные точки) мы решили бы этот вопрос. Тень на север, уна имеет северо-восток, уна Объявление, и т.д.. Следующее изображение немного объяснение того, что я хочу достичь:

Единственное правило, которое применяется в "текст-тень», Доступно только в третьей версии CSS.

p.outlined_text {
    font-size:20px;
    text-shadow:
    red 1px 1px 0px,
    red -1px -1px 0px,
    red 1px 0px 0px,
    red -1px 0px 0px,
    red 0px 1px 0px,
    red 0px -1px 0px,
    red 1px -1px 0px,
    red -1px 1px 0px;
}

И это результат: