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

Материал из IOC
Перейти к: навигация, поиск
 
(не показано 11 промежуточных версий этого же участника)
Строка 1: Строка 1:
 +
 +
[[странная страница]]
 +
<big>'''Заливка градиентом'''</big>
 +
 +
<div style="{{Градиент|left|#ffdddd, #ddddff}}">Как залить абзац градиентом. копируем код (линейный градиент, цвета можно выбрать любые): <nowiki> <div style="{{Градиент|left|#ffdddd, #ddddff}}"> Ваш текст </div> </nowiki></div>
 +
<big>'''Пины'''</big>
 +
 +
Хотите создать красивый список? Вставить "галочки" или большие буквы и символы? Не знаете как? Вам сюда!:)
 +
 +
1. Разноцветные пины (цветные кнопки)
 +
<br>вставляете следующий код:
 +
 +
<nowiki><div style="float:left>[[Файл:Pin.png|30px]] Здесь пишите ту информацию, которую хотите структурировать</div></nowiki>
 +
 +
Вместо синей кнопки можно вставить любую другую из списка:
 +
<br>[[Файл:Pin red.png|30px]] - имя картинки <nowiki>Pin_red.png</nowiki>
 +
<br>[[Файл:Pin.png|30px]] - имя картинки <nowiki>Pin.png</nowiki>
 +
<br>[[Файл:Pink_pin.png|30px]] - имя картинки <nowiki>Pink_pin.png</nowiki>
 +
<br>[[Файл:Green_pin.png|30px]] - имя картинки <nowiki>Green_pin.png</nowiki>
 +
<br>[[Файл:Yellow_pin.png|30px]] - имя картинки <nowiki>Yellow_pin.png</nowiki>
 +
 +
 +
2. Красивые "галочки"
 +
<br>Механизм использования тот же, что и с пинами.
 +
<br>[[Файл:Green_mark.png|30px]] - имя картинки<nowiki>Green_mark.png</nowiki>
 +
 +
3. Литеры (большие буквы и знаки)
 +
 +
<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>
 +
 +
вместо color:#800000 пишите код любого цвета который нравится (цвета можно взять [https://ru.wikipedia.org/wiki/Википедия:Таблица_цветов тут])
 +
 +
вместо единички "1" пишите любую букву или символ (например: !) и наслаждаетесь результатом :)
 +
----
 +
 
<big>'''Спойлеры'''</big>
 
<big>'''Спойлеры'''</big>
  
−
1. Он открыт, но текст можно закрыть
+
''1. Он открыт, но текст можно закрыть''
 +
 
  
 
<div class="mw-collapsible">
 
<div class="mw-collapsible">
Строка 8: Строка 44:
 
</div>
 
</div>
  
−
2. Можно увидеть что спрятано
+
 
 +
''2. Можно увидеть что спрятано''
 +
 
  
 
<spoiler text="таинственные тайны"> а тут пусто) неожиданно) </spoiler>
 
<spoiler text="таинственные тайны"> а тут пусто) неожиданно) </spoiler>
  
−
3. Хитрая табличка
+
 
 +
''3. Хитрая табличка''
 +
 
  
 
{| class="mw-collapsible mw-collapsed wikitable"
 
{| class="mw-collapsible mw-collapsed wikitable"
Строка 21: Строка 61:
 
| будет || скрыто
 
| будет || скрыто
 
|}
 
|}
−
4. Если охота чтоб спойлер в рамочке и во всю ширину окна
 
  
−
<div class="mw-collapsible mw-collapsed"><div class="mw-collapsible-toggle toccolours" style="float:none;text-align: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">
 
<div class="mw-collapsible-content">
 
<source lang="html4strict" enclose="div">
 
<source lang="html4strict" enclose="div">
−
<p> Здесь можно писать все, что душе угодно</p>
+
Здесь можно писать все, что душе угодно. Правда мелким шрифтом, но я с этим борюсь.
 +
</source></div></div>
  
  
Строка 32: Строка 76:
 
Чуток взято отсюда:
 
Чуток взято отсюда:
 
https://www.mediawiki.org/wiki/Extension:JSpoiler
 
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

Галереи

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

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


  • Подпись картинки

  • Подпись картинки

  • Подпись картинки

  • Подпись картинки

  • Подпись картинки

  • Подпись картинки

  • Подпись картинки

  • Подпись картинки

Источник — «http://iocryb.ru:1122/mediawiki/index.php?title=Песочница&oldid=21596»