inuasparwil.ru

Як зробити ефект вдавленого тексту на css3.

Як зробити ефект вдавленого тексту на CSS3.

Всім привіт! Сьогодні я покажу простий приклад про те, як зробити втиснутий текст на чистому CSS3.

HTML розмітка досить проста.


lang="En"gt;

charset="UTF-8"gt;
втиснутий текст


class="Wrapper"gt;
втиснутий текст





але і CSS код не складніше

body {
background:# 222-
color:# 131313-
font-size:200px-
}

.wrapper p {
text-align: center-
text-transform: uppercase-
text-shadow:3px3px5px# 2c2c2c-
}


Вся суть в тому, щоб зробити колір тексту темніше, ніж фоновий, а колір тіні, навпаки, зробити світліше фонового кольору, і тоді ми отримаємо ефект вдавленого текст на CSS3.

Отже, спасибі за увагу і удачі!

Поділися в соціальних мережах:

Схожі
Чуйний "липкий" підвал сайту.Чуйний "липкий" підвал сайту.
Як зробити просту навігацію на html5 і css3.Як зробити просту навігацію на html5 і css3.
Як зробити самостійно перегортаються текст на css3.Як зробити самостійно перегортаються текст на css3.
Як зробити прогрес бар на чистому css3.Як зробити прогрес бар на чистому css3.
Навіщо потрібен псевдоклас target в css3.Навіщо потрібен псевдоклас target в css3.
Як зробити прелоадер на чистому css3.Як зробити прелоадер на чистому css3.
Як зробити слайдер на чистому css3 без використання jаvascript.Як зробити слайдер на чистому css3 без використання jаvascript.
Як зробити блоки зі слайдер ефектом на чистому css3.Як зробити блоки зі слайдер ефектом на чистому css3.
Тіні для тексту і блоків.Тіні для тексту і блоків.
Як зробити анімацію завантаження на чистому css3.Як зробити анімацію завантаження на чистому css3.
» » Як зробити ефект вдавленого тексту на css3.