Мастер-класс "Как применить Рамочник для оформления: двойная анимированная рамка"
Гайсина Залифа Шакуровна
учитель математики
МОБУ СОШ село Ишемгул
Зианчуринский район
Республика Башкортостан
2017 год
Как применить Рамочник для оформления:
двойная анимированная рамка
Цель:
1.Обучить последовательному действию создания двойной анимированной рамки на сайте Писец для выбранной картины с помощью Рамочника.
Задача:
Оказать помощь участникам «УчПортфолио» для работы на сайте.
![](http://uchportfolio.ru/public_files/972896027.gif)
![](http://uchportfolio.ru/public_files/815138258.jpg)
Шаг 2
![](http://uchportfolio.ru/public_files/1179539561.png)
Шаг 3
Выбираю общую рамку и меняю все параметры границы: ширину, цвет, внешний вид границы и ширину фона, которые показаны на рисунке
![](http://uchportfolio.ru/public_files/691267165.png)
![](http://uchportfolio.ru/public_files/834771155.png)
![](http://uchportfolio.ru/public_files/403792256.png)
![](http://uchportfolio.ru/public_files/1054556499.png)
![](http://uchportfolio.ru/public_files/896785232.png)
![](http://uchportfolio.ru/public_files/973789742.png)
![](http://uchportfolio.ru/public_files/1583382552.png)
![](http://uchportfolio.ru/public_files/1950643567.png)
![](http://uchportfolio.ru/public_files/1441080137.png)
![](http://uchportfolio.ru/public_files/681574055.png)
![](http://uchportfolio.ru/public_files/1342151530.png)
учитель математики
МОБУ СОШ село Ишемгул
Зианчуринский район
Республика Башкортостан
2017 год
Как применить Рамочник для оформления:
двойная анимированная рамка
Цель:
1.Обучить последовательному действию создания двойной анимированной рамки на сайте Писец для выбранной картины с помощью Рамочника.
Задача:
Оказать помощь участникам «УчПортфолио» для работы на сайте.
Предполагаемый продукт:
![](http://uchportfolio.ru/public_files/1342151530.png)
![](http://uchportfolio.ru/public_files/1342151530.png)
Шаг 1
Для создания двойной анимированной рамки на сайте Писец для выбранной картины с помощью Рамочника я скачала с интернета вот эти картинки.
![](http://uchportfolio.ru/public_files/976642771.gif)
![](http://uchportfolio.ru/public_files/1103642970.gif)
![](http://uchportfolio.ru/public_files/972896027.gif)
и картину для содержимого рамки, т.е. выбранная картина
![](http://uchportfolio.ru/public_files/815138258.jpg)
Шаг 2
![](http://uchportfolio.ru/public_files/1179539561.png)
Шаг 3
Выбираю общую рамку и меняю все параметры границы: ширину, цвет, внешний вид границы и ширину фона, которые показаны на рисунке
![](http://uchportfolio.ru/public_files/691267165.png)
Шаг 4
Для фона линий рамки выбраны картины. Вставляю URL этих картин
Для фона линий рамки выбраны картины. Вставляю URL этих картин
![](http://uchportfolio.ru/public_files/834771155.png)
Шаг 5
Вставляем чередуя 4 одинаковые URL одной из картин в окошко для вставки
Вставляем чередуя 4 одинаковые URL одной из картин в окошко для вставки
![](http://uchportfolio.ru/public_files/403792256.png)
Шаг 6
Вставляем URL других 2-х картин
Вставляем URL других 2-х картин
![](http://uchportfolio.ru/public_files/1054556499.png)
Шаг 7
Для самой последней выбираю неподвижный фоновый рисунок
Для самой последней выбираю неподвижный фоновый рисунок
![](http://uchportfolio.ru/public_files/896785232.png)
Шаг 8
Я выбрала фон 96, тоже голубоватый цвет
Я выбрала фон 96, тоже голубоватый цвет
![](http://uchportfolio.ru/public_files/973789742.png)
Шаг 9
Нажимая на "Добро" получим анимированную рамочку. Двойная анимированная рамка готова. Можно поместить выбранную картину в полученную анимированную двойную рамку
Нажимая на "Добро" получим анимированную рамочку. Двойная анимированная рамка готова. Можно поместить выбранную картину в полученную анимированную двойную рамку
![](http://uchportfolio.ru/public_files/1583382552.png)
Шаг 10
Для этого удаляю Содержимое рамки, убираю Подпись
Для этого удаляю Содержимое рамки, убираю Подпись
![](http://uchportfolio.ru/public_files/1950643567.png)
Шаг 11
Вместо Содержимого рамки вставляю картину из интернета, т.е. URL - адрес выбранной картинки в окошко для вставки адреса
Вместо Содержимого рамки вставляю картину из интернета, т.е. URL - адрес выбранной картинки в окошко для вставки адреса
![](http://uchportfolio.ru/public_files/1441080137.png)
Шаг 12
Превью, т.е. предварительный просмотр полученной картинки в двойной анимированной рамке.
Меняю настройки кода на "сайты narod ru". Появляется код надписи.
Меняю настройки кода на "сайты narod ru". Появляется код надписи.
![](http://uchportfolio.ru/public_files/681574055.png)
Шаг 13
Копирую код надписи и вставляю в текстовом блоке для вставки Вставить. Сохранив, заходя в "Личный кабинет" - "Стиль портфолио" - "Просмотр портфолио", проверяем нашу работу. Картина анимированная, результат можете посмотреть на главной странице моего сайта, получается очень красиво! Инфоблок называется "♦ Мастер-класс "Как применить Рамочник для оформления: двойная анимированная рамка"
![](http://uchportfolio.ru/public_files/1342151530.png)
Уважаемые коллеги! Желаю вам успешного продвижения вместе с "УчПортфолио!"
Другие мастер-классы пользователя
- Построение описанных около окружности многоугольников на интерактивной доске Whiteboard
- Как украсить текстовой блок на сайте "УчПортфолио"
- Построение правильного шестиугольника на интерактивной доске Whiteboard
- Как оформить надписи в рамке на сайте Писец
- Решение тригонометрических уравнений на интерактивной доске Whiteboard
- Создание статичеcкой надписи на сайте Писец
- Как изменить размеры фотографий или картинок для вставки в инфоблок на УчПортфолио
- Объединение двух картинок в одну
- Как загрузить картинки без фона в текстовой блок инфоблока
- Как применить Рамочник для оформления: картина и надпись в общей рамке
Обнаружили плагиат? Сообщите об этом
Комментарии
![](/users/32bb90e8976aab5298d5da10fe66f21d/mini_mA9p93LxEAY0.jpg)
#1 Вы нас учите работать с этими рамками уже долго и упорно, и каждый раз - каждый урок - своеобразен. Чем дальше, тем красивее и привлекательнее.Нам это всё многим пригодится, вот увидите. Спасибо Вам за Ваш упорный труд. Молодец! Что ещё Вы нам покажете впереди - даже не мыслю, а у Вас уже идеи - непочатый край! Удачи!
Ольга Степанова, дата: 14.08.2017 в 21:56
![](/users/74a338894d9bedbc6ddf6746befe1245/mini_k82ENbDYIr1J.jpg)
#2 Вы и тут первая, Ольга Михайловна! Молодец! Вы правы, Ольга Михайловна! Я уже задумываю следующий МК! Еще задачу Вам усложню! Спасибо большое Вам за добрый отзыв! Удачи Вам в применении! Ия буду очень рада!
Залифа Гайсина, дата: 14.08.2017 в 21:59
![](/users/a24bdc3e59a4c624eee8318a51bb55b9/mini_uNdWG8lEBP4X.jpg)
#3 Это так красиво!У меня тоже так получился, но у вас еще лучше, красивее. Эти рамки пригодятся для оформления газет
Фанзиль Габитов, дата: 14.08.2017 в 22:05
![](/users/74a338894d9bedbc6ddf6746befe1245/mini_k82ENbDYIr1J.jpg)
#4 Фанзиль Рамилович, спасибо Вам большое за добрый комментарий! У Вас еще лучше получится, вот увидите! Вы всегда находите для меня слова поддержки, спасибо Вам еще раз! И удачи Вам!
Залифа Гайсина, дата: 14.08.2017 в 22:10
![](/users/176d4cc26aefd148d136259a089d354a/mini_HHTg0ffd47Am.jpg)
#5 Залифа Шакуровна, очень красивые рамочки получаются. Как же вы это всё придумываете, сколько времени тратите, а потом учите нас. Спасибо, Залифа Шакуровна. Мастер-класс у Вас получился ясным и понятным. Всё чётко.
Ирина Мерзлютина, дата: 15.08.2017 в 9:04
![](/users/74a338894d9bedbc6ddf6746befe1245/mini_k82ENbDYIr1J.jpg)
#6 А Вам спасибо, Ирина Александровна, за теплый отзыв! Приятно читать добрые отзывы. Да, рамочки очень красивые, еще и разнообразные. Можно оформить каждому по своему вкусу, по тону фона портфолио. Вариантов оченьмного. Удачи Вам всем, уважаемые коллеги!
Залифа Гайсина, дата: 15.08.2017 в 19:55
![](/users/3b8c6dc0b282e4aa77ac2a109dbc83c8/mini_5pD94MGvIOQr.jpg)
#7 Красота, спасибо! надо попробовать, очень нравится!
Елена Юрьевна Уварова, дата: 27.10.2018 в 7:15
Чтобы оставить комментарий, пожалуйста, зарегистрируйтесь и авторизируйтесь на сайте.