Песочница — различия между версиями

Материал из IOC
Перейти к: навигация, поиск
 
(не показано 20 промежуточных версий этого же участника)
Строка 1: Строка 1:
__NOTOC__
+
 
[[Файл:Header_fairy_tale.jpg|center]]
+
[[странная страница]]
{| style="width: 100%; align: top; background-color:#ffffff; border: 0px solid #ffffff;"
+
<big>'''Заливка градиентом'''</big>
|-style="vertical-align:top;"
+
 
| rowspan="5"|[[Файл:Hill fairy tale.jpg|200px|left]] || <style="width: 100%; background-color:#FFFfff; border: 2px solid #ffffff; vertical-align: top;"> |
+
<div style="{{Градиент|left|#ffdddd, #ddddff}}">Как залить абзац градиентом. копируем код (линейный градиент, цвета можно выбрать любые): <nowiki> <div style="{{Градиент|left|#ffdddd, #ddddff}}"> Ваш текст </div> </nowiki></div>
==<font color="#281258" font face="Gabriola" size="5.5">'''[[Правила сетевой сказочной викторины|Правила сетевой сказочной викторины]]'''</font>==
+
<big>'''Пины'''</big>
==<font color="#281258" font face="Gabriola" size="5.5">'''[[Участники викторины по серии книг "Сказочные герои" |Участники викторины]]'''</font>==
+
 
||
+
Хотите создать красивый список? Вставить "галочки" или большие буквы и символы? Не знаете как? Вам сюда!:)
==<font color="#281258" font face="Gabriola" size="5.5">'''[[Опрос для детей]]'''</font>==
+
 
==<font color="#281258" font face="Gabriola" size="5.5">'''[[Опрос для родителей]]'''</font>==
+
1. Разноцветные пины (цветные кнопки)
|
+
<br>вставляете следующий код:
| rowspan="5"| [[Файл:Rock_fairy_tale.jpg|200px|right]]
+
 
|- style="vertical-align:top;"
+
<nowiki><div style="float:left>[[Файл:Pin.png|30px]] Здесь пишите ту информацию, которую хотите структурировать</div></nowiki>
| colspan="2"| <div style="height: 200px; overflow: auto; padding: 1px; font-size: 10pt" >
+
 
==<font color="#281258" font face="Gabriola" size="5.5">'''Новости сетевого события'''</font>==
+
Вместо синей кнопки можно вставить любую другую из списка:
<!--↓Писать ниже ↓--></div>
+
<br>[[Файл:Pin red.png|30px]] - имя картинки <nowiki>Pin_red.png</nowiki>
|-style="vertical-align:top;"
+
<br>[[Файл:Pin.png|30px]] - имя картинки <nowiki>Pin.png</nowiki>
| <style="width: 33%; background-color:#FFFfff; border: 2px solid #ffffff;vertical-align: top;">|
+
<br>[[Файл:Pink_pin.png|30px]] - имя картинки <nowiki>Pink_pin.png</nowiki>
==<font color="#281258" font face="Gabriola" size="5.5">'''Вернисаж'''</font>==
+
<br>[[Файл:Green_pin.png|30px]] - имя картинки <nowiki>Green_pin.png</nowiki>
<br>[https://cloud.mail.ru/public/7nrG/i98dQbJj2 Детские рисунки]
+
<br>[[Файл:Yellow_pin.png|30px]] - имя картинки <nowiki>Yellow_pin.png</nowiki>
<br>[https://cloud.mail.ru/public/Dfyi/tv8TKXRYK Детские рисунки]
+
 
||
+
 
==<font color="#281258" font face="Gabriola" size="5.5">'''Викторина для 3-4х классов'''</font>==
+
2. Красивые "галочки"
[https://cloud.mail.ru/public/HsPW/a58T5uNQF Вопросы викторины]
+
<br>Механизм использования тот же, что и с пинами.
|-style="vertical-align:top;"
+
<br>[[Файл:Green_mark.png|30px]] - имя картинки<nowiki>Green_mark.png</nowiki>
|  <style="width: 33%; background-color:#FFFfff; border: 2px solid #ffffff; vertical-align: top;">|
+
 
==<font color="#281258" font face="Gabriola" size="5.5">'''Презентации'''</font>==
+
3. Литеры (большие буквы и знаки)
<br>[https://cloud.mail.ru/public/J4ni/D5HoRCDJJ Сказочные герои Яр. обл]
+
 
<br>[https://cloud.mail.ru/public/7xRM/uyjiGaBxp Сказочная карта России]
+
<div style="float: left; text-transform:uppercase; line-height:80%; padding:0px 8px 4px 0px; display: block; color:#800000; font-size: 70px; font-family: Georgia, Times New Roman, Trebuchet MS; "><strong>1</strong></div><br>Вставляете вот такой вот текст:<nowiki><div style="float: left; text-transform:uppercase; line-height:80%; padding:0px 8px 4px 0px; display: block; color:#800000; font-size: 70px; font-family: Georgia, Times New Roman, Trebuchet MS; "><strong>1</strong></div></nowiki>
<br>[https://cloud.mail.ru/public/Mkr5/iooHerh7w Сказочная Россия]
+
 
<br>[https://cloud.mail.ru/public/5rFg/fp1eMyjvs Сказочное кольцо]
+
вместо color:#800000 пишите код любого цвета который нравится (цвета можно взять [https://ru.wikipedia.org/wiki/Википедия:Таблица_цветов тут])
<br>[https://cloud.mail.ru/public/3SR9/Zp4ycSvCZ Родина снежинок]
+
 
||
+
вместо единички "1" пишите любую букву или символ (например: !) и наслаждаетесь результатом :)
==<font color="#281258" font face="Gabriola" size="5.5">'''Викторина для 5-7х классов'''</font>==
+
----
[https://cloud.mail.ru/public/9FFU/sCyHwCNcE Вопросы викторины]
+
 
|-style="vertical-align:top;"
+
<big>'''Спойлеры'''</big>
<style="width: 33%; background-color:#FFFfff; border: 2px solid #ffffff;vertical-align: top;">|
+
 
==<font color="#281258" font face="Gabriola" size="5.5">'''Справочник туристических брендов'''</font>==
+
''1. Он открыт, но текст можно закрыть''
[https://cloud.mail.ru/public/61YB/SSNRrCLRt Справочник]
+
 
||
+
 
==<font color="#281258" font face="Gabriola" size="5.5">'''[[Обмен мнениями "Сказочный переполох"|Обмен мнениями]]'''</font>==
+
<div class="mw-collapsible">
 +
 
 +
Текст, который можно скрыть.
 +
</div>
 +
 
 +
 
 +
''2. Можно увидеть что спрятано''
 +
 
 +
 
 +
<spoiler text="таинственные тайны"> а тут пусто) неожиданно) </spoiler>
 +
 
 +
 
 +
''3. Хитрая табличка''
 +
 
 +
 
 +
{| class="mw-collapsible mw-collapsed wikitable"
 +
! Заголовок || всегда будет виден
 +
|-
 +
| Содержимое || всегда
 +
|-
 +
| будет || скрыто
 
|}
 
|}
  
[[Файл:Book fairy tale.jpg|960px|center]]
+
 
 +
''4. Если охота чтоб спойлер в рамочке и во всю ширину окна''
 +
 
 +
 
 +
<div class="mw-collapsible mw-collapsed"><div class="mw-collapsible-toggle toccolours" style="float:none;text-align:center">'''Показать исходный текст'''</div>
 +
<div class="mw-collapsible-content">
 +
<source lang="html4strict" enclose="div">
 +
Здесь можно писать все, что душе угодно. Правда мелким шрифтом, но я с этим борюсь.
 +
</source></div></div>
 +
 
 +
 
 +
 
 +
Чуток взято отсюда:
 +
https://www.mediawiki.org/wiki/Extension:JSpoiler
 +
----
 +
 
 +
<big>'''Галереи'''</big>
 +
 
 +
Что делать когда нужно вставить много красивых картинок с подписями?
 +
 
 +
Можно сделать так)
 +
 
 +
 
 +
<gallery mode="packed-hover">
 +
Image:Yum sch30 66.jpg|''Подпись картинки''
 +
Image:Yum sch30 66.jpg|''[[Подпись со ссылкой]]''
 +
Image:Yum sch30 66.jpg|''Подпись картинки''
 +
Image:Yum sch30 66.jpg|''Подпись картинки''
 +
Image:Yum sch30 67.jpg|''Подпись картинки''
 +
Image:Yum sch30 67.jpg|''Подпись картинки''
 +
Image:Yum sch30 67.jpg|''Подпись картинки''
 +
Image:Yum sch30 67.jpg|''Подпись картинки''
 +
Image:Yum sch30 67.jpg|''Подпись картинки''
 +
</gallery>

Текущая версия на 17:14, 8 марта 2019

странная страница Заливка градиентом

Как залить абзац градиентом. копируем код (линейный градиент, цвета можно выбрать любые): <div style="{{Градиент|left|#ffdddd, #ddddff}}"> Ваш текст </div>

Пины

Хотите создать красивый список? Вставить "галочки" или большие буквы и символы? Не знаете как? Вам сюда!:)

1. Разноцветные пины (цветные кнопки)
вставляете следующий код:

<div style="float:left>[[Файл:Pin.png|30px]] Здесь пишите ту информацию, которую хотите структурировать</div>

Вместо синей кнопки можно вставить любую другую из списка:
Pin red.png - имя картинки Pin_red.png
Pin.png - имя картинки Pin.png
Pink pin.png - имя картинки Pink_pin.png
Green pin.png - имя картинки Green_pin.png
Yellow pin.png - имя картинки Yellow_pin.png


2. Красивые "галочки"
Механизм использования тот же, что и с пинами.
Green mark.png - имя картинкиGreen_mark.png

3. Литеры (большие буквы и знаки)

1

Вставляете вот такой вот текст:<div style="float: left; text-transform:uppercase; line-height:80%; padding:0px 8px 4px 0px; display: block; color:#800000; font-size: 70px; font-family: Georgia, Times New Roman, Trebuchet MS; "><strong>1</strong></div>

вместо color:#800000 пишите код любого цвета который нравится (цвета можно взять тут)

вместо единички "1" пишите любую букву или символ (например: !) и наслаждаетесь результатом :)


Спойлеры

1. Он открыт, но текст можно закрыть


Текст, который можно скрыть.


2. Можно увидеть что спрятано


таинственные тайны


3. Хитрая табличка


Заголовок всегда будет виден
Содержимое всегда
будет скрыто


4. Если охота чтоб спойлер в рамочке и во всю ширину окна


Показать исходный текст
Здесь можно писать все, что душе угодно. Правда мелким шрифтом, но я с этим борюсь.


Чуток взято отсюда: https://www.mediawiki.org/wiki/Extension:JSpoiler


Галереи

Что делать когда нужно вставить много красивых картинок с подписями?

Можно сделать так)