понеділок, 4 березня 2019 р.

Twinery. Приклад з дизайном

Дизайн в Twinery

Наприклад, створимо квест з таким оформленням 

1. Створюємо нову історію

Загальний дизай для всіх сторінок гри настроюється так:



І додаємо код

tw-story{
font-family: Arial;
font-size: 24px;
padding: 10px 20px;
background: none;
}
body{
background-image: url("http://rulib.info/uploads/11_05_2013/view/201209/oboik.ru_15713.jpg");
background-size: cover;
}

2. Будуємо ось таку структуру

 Починаємо з першої стартової цеглинки


<h3>Вітаємо на сторінці інтелект-квесту! </h3>
<img src="https://questroom.com.ua/dist/pict_rooms/f9OAKr6Z.png" width="300" height="120">
<p class="text"> **ПОГРАЄМО?**</p>
[[ТАК]]
[[НІ]]

<style>
h2{color: #F5F5DC;}
.text{color: #B22222;
font-family: Verdana, Arial, Helvetica, sans-serif; 
font-size: 28pt;}
</style>

3. Наступний рівень цеглинок Гарні посилання. 

Приклад створення посилань з використанням картинок



[[ картинка -> назва реального посилання ]]
**Обери чию історію будеш одслідковувати**
[[  <img src="https://vignette.wikia.nocookie.net/disney/images/4/4e/%D0%94%D0%B8%D0%BF%D0%BF%D0%B5%D1%80_%D0%9F%D0%B0%D0%B9%D0%BD%D1%81.png/revision/latest?cb=20151026135025&path-prefix=ru" width="200" > -> Діппер ]] [[ <img src="https://i.pinimg.com/originals/c5/48/48/c548481f30a715b2b279b1c19b2a4a17.png" width="200" > -> Венді ]]


Немає коментарів:

Дописати коментар