Эффект стопки бумаги.

Всем привет. Сегодня опять небольшой субботний пост. Эффект стопки бумаги при оформлении участка текста на CSS. Добавляйте его в копилку других похожих вариантов оформления текста. Кто заинтересован можно посмотреть ещё один здесь и в этом сообщении.

Код совсем маленький. И как обычно,  устанавливаем его непосредственно в редакторе сообщений в нужном месте, перейдя в режим HTML. Вот так примерно это будет выглядеть на странице.

Лес, точно терем расписной,

Лиловый, золотой, багряный,

Веселой, пестрою стеной

Стоит над светлою поляной.

Березы желтою резьбой

Блестят в лазури голубой,

Как вышки, елочки темнеют,

А между кленами синеют

То там, то здесь в листве сквозной

Просветы в небо, что оконца.

(И. Бунин)

Ну и сам код.

<style>.layered-paper {
    background : #E3E4E4 ;
    box-shadow:
        0 2px 2px rgba(0,0,0,0.15),
        0 10px 0 -5px #E3E4E4 ,
        0 10px 1px -4px rgba(0,0,0,0.15),
        0 20px 0 -10px # E3E4E4,
        0 20px 1px -9px rgba(0,0,0,0.15);
}</style>

<div class="layered-paper">
здесь ваш текст
</div>

Цветовые решения выделены синим цветом. Красным-ваш текст.

Всем хороших выходных. Спасибо, что читаете мои шпаргалки. До встречи.

здесь можно оформить подписку на новые шпаргалки

Введите Ваш email