В статье мы рассмотрим, как можно создать 3D текст с тенью при помощи CSS3.
Разметка HTML<div class="text-wrap box">SKRIPTER.info</div>
CSS.box {
color: #00A0D9;
text-shadow: 0 0 2px #686868, 0 1px 1px #DDDDDD, 0 2px 1px #D6D6D6, 0 3px 1px #CCCCCC, 0 4px 1px #C5C5C5, 0 5px 1px #C1C1C1, 0 6px 1px #BBBBBB, 0 7px 1px #777777, 0 8px 3px rgba(100, 100, 100, 0.4), 0 9px 5px rgba(100, 100, 100, 0.098), 0 10px 7px rgba(100, 100, 100, 0.15), 0 11px 9px rgba(100, 100, 100, 0.2), 0 12px 11px rgba(100, 100, 100, 0.247), 0 13px 15px rgba(100, 100, 100, 0.298);
}
.text-wrap {
border: 5px solid white;
box-shadow: 0 0 4px rgba(0, 0, 0, 0.8);
clear: both;
font-family: 'Ubuntu',serif;
font-size: 70px;
margin: 20px auto;
min-height: 100px;
padding: 30px 0;
position: relative;
text-align: center;
width: 700px;
}
И в итоге получим 3D эффект с тенью.
Скачивание файлов доступно только зарегистрированным пользователям