Лекция 1.4. Работа с изображениями — различия между версиями

Материал из Wiki
Перейти к:навигация, поиск
(Расположение по центру)
 
(не показано 20 промежуточных версий этого же участника)
Строка 1: Строка 1:
В Вики приветствуется размещение изображений на страницах статей. Чтобы украсить свою статью яркой картинкой или подробной схемой, вы должны провести некоторые подготовительные работы.  
+
[[Изображение:AG00042 .GIF|right]]
 +
<big>
 +
* Ознакомьтесь с [[Размещение изображений в среде WikiWiki|приемами работы с графическими файлами]] в среде Wiki.
  
Загружать файлы могут только зарегистрированные участники.  
+
* Оформите написанную ранее Вами статью 3-4 графическими объектами (фотографиями, картинками, иллюстрациями, схемами и т.д.).
 +
</big>
  
На страницах Вики можно использовать фотографии учеников, на которые вами было получено письменное согласие их родителей.
 
  
== Вставка без изменения размеров ==
 
Чтобы вставить загруженное изображение в статью, достаточно указать ссылку на него: <nowiki>[[Изображение:Файл]]</nowiki>.
 
  
«По умолчанию» изображение будет воспроизводиться слева в полную величину, а текст начинаться ниже его. Если вы хотите дать только ссылку на изображение, не воспроизводя его на странице, то поставьте двоеточие перед словом «Изображение»: [[:Изображение:Файл]]. Щелчок на такую надпись загружает страницу самого изображения. Вот попробуйте: Изображение:Wiki logo.png.
 
== Пояснительная подпись ==
 
Чтобы сделать поясняющую подпись, используется атрибут «frame»: [[Изображение:Wiki.png|frame|Пояснительная подпись]]
 
Он заключает изображение в рамку и смещает изображение вправо. В области «Пояснительная подпись» можно применять вики-разметку.
 
 
== Уменьшение размеров ==
 
Для получения изображения заданной ширины (высота изменяется пропорционально), запишите её в пикселах (в формате ЧИСЛОрх). Этот атрибут можно использовать как отдельно, так и совместно с атрибутом «thumb»:
 
  
[[Изображение:MediaWik.png|100px|Альтернативный текст для изображений]]
+
[[Категория:Веб 2.0]]
 
 
Атрибут «thumb», вставленныё между именем файла и пояснительной подписью, уменьшает ширину изображения (в зависимости от настроек пользователя — от 120px до 300px; высота изменяется пропорционально), прижимает его вправо и помещают в рамку:
 
 
 
[[Изображение:MediaWik.png|thumb|Пояснительная подпись]]
 
Кроме того, справа от пояснительной подписи появляется специальный значок: щёлкнув по нему, можно перейти на страницу изображения и посмотреть его в натуральную величину. Текст располагается слева от значка.
 
 
 
Не забывайте о соразмерности изображения и текста. Если статья небольшая, то можно подобрать высоту изображения так, чтобы текст полностью охватывал его. В длинной статье не стоит делать изображения чрезмерно маленькими, иначе они «утонут» в тексте.
 
 
 
 
 
== Расположение на странице ==
 
 
 
 
=== Смещение вправо ===
 
 
Кроме рассмотренных выше атрибутов «frame», «class=rimage», «thumb» и «thumbnail», прижать изображение вправо можно атрибутом «right». Пример:
 
 
 
[[MediaWik.png|100px|right|]]
 
 
 
Текст, следующий за таким изображением, обтекает его слева. Не забудьте поставить вертикальную чёрточку «|» после слова «right»: это нужно для того, чтобы оно не воспринималось как альтернативный текст для изображения.
 
 
 
В отличие от изображения с атрибутом «frame» или «thumb», в данном случае изображение не оказывается заключённым в рамку, и альтернативный текст не указывается в видимой подписи. Однако он всё равно используется в качестве всплывающей подсказки (после наведения курсора мыши на изображение), а также показывается вместо картинки для тех читателей, которые отключили отображение изображений в своём браузере. Поэтому рекомендуется указывать альтернативный текст после атрибута «right», за вертикальной чёрточкою. Пример:
 
 
 
[[Изображение:MediaWik.png|100px|right|Пояснительная подпись]]
 
 
 
=== Смещение влево ===
 
 
Чтобы прижать изображение к левому краю страницы, используйте атрибут «left» или «none». Это работает в том числе и для изображений с атрибутом «frame» или «thumb». Пример:
 
 
 
[[Изображение:MediaWik.png|100px|thumb|left|Пояснительная подпись]]
 
 
 
Текст, следующий за таким изображением, обтекает его справа.
 
 
 
== Окончание обтекания ==
 
 
Для пометки окончания обтекающего изображение текста используйте специальный HTML-код:
 
 
 
<br clear="both" />
 
 
 
Текст, расположенный после этого кода, будет начинаться с новой строки — и будет располагаться ниже нижнего края любого из изображений, расположенных прежде этого кода в статье.
 
 
 
 
 
=== Расположение по центру ===
 
 
Для расположения изображения в центре страницы следует использовать атрибут «center». Пример:
 
 
 
[[Изображение:MediaWik.png|100px|thumb|center|Пояснительная подпись]]
 
 
 
 
Пояснительная подпись
 
Текст, следующий за таким изображением, не обтекает его ни с одной из сторон, а начинается ниже нижнего края изображения.
 
 
 
== Дополнительные возможности ==
 
 
 
 
== Галереи ==
 
 
Для вставки нескольких изображений в статью (например, изображений картин в статье о художнике), применяется специальный служебный тег <gallery>, который группирует изображения в галерею (по 4 изображения в каждом ряду).
 
 
 
В простейшем случае используется следующий синтаксис.
 
 
 
<gallery>
 
Изображение:wiki.png
 
Изображение:wiki.png|Подпись
 
Изображение:wiki.png|Подпись с [[Заглавная страница|ссылкой]]
 
</gallery>
 
 
Подпись
 
 
Подпись с ссылкой
 
 
 
 
Пример более изощерённого синтаксиса.
 
 
 
<gallery caption='Можно добавлять заголовки'>
 
Также можно вставлять текст
 
 
 
Изображение:Opochka1.jpg|Участники тренинга
 
Изображение:Opochka2.jpg|Работа в группах
 
Изображение:Opochka3.jpg
 
</gallery>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
'''ПОБРОБНЕЕ СМОТРИ в [http://wiki.pskovedu.ru/index.php/ВикиХранилище ВикиХранилище]'''
 
 
 
[[Категория:Семинар]]
 

Текущая версия на 09:59, 19 февраля 2015

AG00042 .GIF

  • Оформите написанную ранее Вами статью 3-4 графическими объектами (фотографиями, картинками, иллюстрациями, схемами и т.д.).