№ - 1 Эффект border « Пузырь »
анимационный стиль css.
Анимация фрагмента заставляет блок двигаться в виде большого мыльного пузыря.
Подходить для выделения изображений и текста на страничках сайта.
Пример - 1 "Пузырь "
При необходимости в стилях меняем :
размеры всего блока - width: 80%; height: 200px;
размер , стиль и цвет окантовки - border: 6px dotted #8DB67E;
фон всего элемента - background: #CDE8C4;
фоновая картинка всего элемента - background: url('url-КАРТИНКИ) no-repeat;
прозрачность - filter: alpha(Opacity=50); opacity: 0.5;
скорость эффекта - animation: anim-primer-border-1-puzyr 10s infinite; - (10s)
добавляем тень - box-shadow: 15px 15px 50px rgba(0,0,0,0.2);
размеры всего блока - width: 80%; height: 200px;
размер , стиль и цвет окантовки - border: 6px dotted #8DB67E;
фон всего элемента - background: #CDE8C4;
фоновая картинка всего элемента - background: url('url-КАРТИНКИ) no-repeat;
прозрачность - filter: alpha(Opacity=50); opacity: 0.5;
скорость эффекта - animation: anim-primer-border-1-puzyr 10s infinite; - (10s)
добавляем тень - box-shadow: 15px 15px 50px rgba(0,0,0,0.2);
Скопировать код
Создайте текстовый документ .txt --> Копируем код в форме и вставляем в файл .txt --> Переименуйте файл в .HTML ---> Откройте с помощью браузера и увидите результат.
Картинки и ссылки
Для сохранения картинки на компьютер наведите курсор на рисунок , сделайте клик правой кнопкой мышки и в выпавшем окне выберите пункт : Сохранить изображение как...
Для получения ссылка на картинку , наведите курсор на рисунок , сделайте клик правой кнопкой мышки и в выпавшем окне выберите пункт: Копировать адрес изображения
Для просмотра оригинала картинки , наведите курсор на рисунок , сделайте клик правой кнопкой мышки и в выпавшем окне выберите пункт: Открыть изображение в новой вкладке или Открыть исходное изображение в новой вкладке.
приложение Яндекс — с Алисой АІ на мобильное устройство с Android или iOS.
Ваш комментарий: