3851
- 0
Нашел красивую реализацию кнопки загрузка .Творческий способ показать интерактивные книги с помощью CSS 3D-преобразования.
Ну я не буду описывать как все это работает,это вы можете прочитать на сайте источника,Я просто объясню как установить.
1.Скачиваем архив Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
,распаковываем и заливаем в папку с шаблоном.
2.В хеад подключаем стили и скрипт
Код:
<link rel="stylesheet" href="{{ tpl_ur l}}/css/book.css" />
<script src="{{ tpl_url }}/js/modernizr.custom.js"></script>
Код:
<ul class="align">
<li>
<figure class='book'>
<!-- Front -->
<ul class='hardcover_front'>
<li>
<div class="coverDesign yellow">/- этот код отвечает заобложку-/
<span class="ribbon">NEW</span>
<h1>CSS</h1>
<p>TRANSFORM</p>
</div>
</li>
<li></li>
</ul>
<!-- Pages -->
<ul class='page'>
<li></li>
<li>
<a class="btn" href="#">Download</a>/-здесь ссылка на загрузку которая внутри книги-/
</li>
<li></li>
<li></li>
<li></li>
</ul>
<!-- Back -->
<ul class='hardcover_back'>
<li></li>
<li></li>
</ul>
<ul class='book_spine'>
<li></li>
<li></li>
</ul>
<figcaption>/- Ну а здесь само описание новости -/
<h1>CSS Ninja</h1>
<span>By Marco Barría for Codrops</span>
<p>Tomatillo water chestnut mustard cabbage yarrow sierra leone bologi. Watercress green bean groundnut earthnut pea dandelion radicchio.</p>
</figcaption>
</figure>
</li>
Можешь почитать и вот эту статейку "Теги li"
Это тоже интересно
- 27.03.1517 лучших генераторов кода CSS3
- 04.01.14Изменяем вид цитат
- 15.01.14Чашка чая на CSS3
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.